Difference between revisions of "Movable functiongraph"

From JSXGraph Wiki
Jump to navigationJump to search
(Created page with "This example shows that a functiongraph can be made movable. It is produced by the following commands: <source lang="xml"> <div id="jxgbox" class="jxgbox" style="width:500px; height:200px...")
 
 
Line 1: Line 1:
 +
By default, the function graph can not be dragged around.
 +
When we allow to the function graph to be movable by setting "fixed:false" we have to notify JSXGraph that the function graph depends on the two free points A and B.
 +
 
This example shows that a functiongraph can be made movable.
 
This example shows that a functiongraph can be made movable.
 +
 
It is produced by the following commands:
 
It is produced by the following commands:
 
<source lang="xml">
 
<source lang="xml">

Latest revision as of 20:30, 25 June 2015

By default, the function graph can not be dragged around. When we allow to the function graph to be movable by setting "fixed:false" we have to notify JSXGraph that the function graph depends on the two free points A and B.

This example shows that a functiongraph can be made movable.

It is produced by the following commands:

<div id="jxgbox" class="jxgbox" style="width:500px; height:200px;"></div>
<script type="text/javascript">
  var board = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-5, 2, 5, -2], axis: true});
  var A = board.create('point', [1, 0], {name:'A'});
  var B = board.create('point', [3, 1], {name:'B'});
  
  var f = board.create('functiongraph', function(x) {
      var ax = A.X(),
          ay = A.Y(),
          bx = B.X(),
          by = B.Y(),
          a = (by - ay) / ( (bx - ax) * (bx - ax) );
      return a * (x - ax) * (x - ax) + ay;
  }, {fixed: false});
  
  f.addParents([A, B]);
</script>