JSXGraph - 创建一个点的轨迹，该点随着滑块值从最小值变为最大值而移动答案

【问题标题】：JSXGraph - Creating a locus of a point that moves as a slider value goes from a min to a maxJSXGraph - 创建一个点的轨迹，该点随着滑块值从最小值变为最大值而移动
【发布时间】：2022-10-24 00:03:19
【问题描述】：

由于后来的 JS 接口不佳，我正在尝试从 Geogebra 切换到 JSXGraph。 Geogebra 有一个轨迹函数，它将一个点和一个滑块作为输入，并显示当滑块从最小值变为最大值时点的轨迹。

我似乎找不到他们在 JSXGraph 中实现这一点的方法。我尝试使用带有滑块（扩展滑翔机）和点的参数的 tracecurve，但这不起作用。

谢谢。

【问题讨论】：

标签： jsxgraph

【解决方案1】：

这是您正在寻找的功能吗？

在这个版本中，当滑块向前移动时，点的位置由滑块值指定（因此基本上 x 和 y 坐标被指定为滑块值的函数）。

该代码只是创建一个多边形链并在滑块移动时显示/隐藏其中的一部分。当然，可以完全隐藏这些段，并且可以设置点的密度（与 geogebra 不同，据我所知，轨迹取决于滑块移动的速度）。

const board = JXG.JSXGraph.initBoard('jxgbox', { 
    boundingbox: [-5, 5, 5, -5], axis:true
});

var s = board.create('slider', [[-3,-4], [2,-4],[0,0,8]], {snapWidth: 1});
    
var p = [];

for (let i = 0; i <= 8; i++) { 
  p.push( [i-4,i-4] );
}
    
var loc = board.create('polygonalchain', p, {borders: {strokeWidth: 1, visible: false}, vertices: {visible: false}});

loc.vertices[0].setAttribute({visible: true});

s.on('drag', function(e){
    for (let i = 1; i <= 8; i++) { 
    if (i > s.Value()) {
        loc.vertices[i].setAttribute({visible: false});
      loc.borders[i-1].setAttribute({visible: false});
        } else {
        loc.vertices[i].setAttribute({visible: true});
      loc.borders[i-1].setAttribute({visible: true});
        }   
    }    
});

Link the the JSfiddle

【讨论】：