在一组对象中，Segment 不移动

Question

我是 jsxgraph 的新手。 我会有很多问题。 我的第一张图如下

这是我能够编码的内容。

> <div id="box" class="jxgbox" style="width:500px; height:500px;">
> <script type="text/javascript"> var board =
> JXG.JSXGraph.initBoard('box', {boundingbox: [0, 10, 10, 0],
> axis:false}); var grid = board.create('grid', []); var t1 =
> board.create('text',[.5,5.2,"$A$"]); var t2 =
> board.create('text',[1.9,3.6,"$0$"]); var t3 =
> board.create('text',[1.9,6.4,"$1$"]); var p1 =
> board.create('point',[1,5], {name:'',
> size:1,strokeColor:'#AE181E',visible:false,fixed:true}); var p2 =
> board.create('point',[2,5],
> {name:'',size:1,strokeColor:'#AE181E',visible:false,fixed:true}); var
> p3 = board.create('point',[2,4], {name:'',
> size:1,strokeColor:'#AE181E',visible:false,fixed:true}); var p4 =
> board.create('point',[2,6],
> {name:'',size:1,strokeColor:'#AE181E',visible:false,fixed:true}); var
> li1 = board.create('line',[p1,p2], {straightFirst:false,
> straightLast:false,strokeColor:'#AE181E',strokeWidth:2}); var li2 =
> board.create('line',[p3,p4], {straightFirst:false,
> straightLast:false,strokeColor:'#AE181E',strokeWidth:2}); var seg1 =
> board.create('segment',[[2,4],[2,6]],{strokeColor:'#5F9EA0'}); var p5
> = board.create('point',[2.2,4], {name:'', size:1,strokeColor:'#AE181E',visible:false,fixed:true}); var p6 =
> board.create('point',[3.2,4], {name:'',
> size:1,strokeColor:'#AE181E',visible:false,fixed:true}); d=[]
> d[0]=board.create('glider',[seg1],{name:'',strokeColor:'#5F9EA0',fillColor:'#5F9EA0'});
> d[1] = board.create('point',[2.2,4], {name:'',
> size:1,strokeColor:'#AE181E',visible:false,fixed:true}); d[2] =
> board.create('point',[3.2,4], {name:'',
> size:1,strokeColor:'#AE181E',visible:false,fixed:true});
> d[3]=board.create('segment',[d[1],d[2]]);
> d[4]=board.create('text',[3.5,4,"$B$"]);
> d[5]=board.create('text',[2.7,4.2,"$C$"]); var gr =
> board.create('group',d) </script> </div>

但是段d[3]不会随着其他d[]元素移动，我无法获得 $\lambda_0$ 的 Latex 渲染。

我的错误是什么？

Answer 1

您使用组 object 实现依赖对象的方法非常有创意。 只有两个小问题会阻止您的施工工作：

1. 组可能仅包含点、文本、图像（具有单个坐标的对象）。
2. d[1]和d[2]点在您的构造中是固定的，即不允许移动。

这是您的构造的一个工作变体，请在https://jsfiddle.net/d47bfye6/现场查看：

JXG.Options.point.strokeColor = '#AE181E';
var board = JXG.JSXGraph.initBoard('box', {boundingbox: [0, 10, 10, 0], axis: false});

var grid = board.create('grid', []); 
var t1 = board.create('text',[.5, 5.2,"$A$"]); 
var t2 = board.create('text',[1.9, 3.6,"$0$"]); 
var t3 = board.create('text',[1.9, 6.4,"$1$"]); 
var p1 = board.create('point', [1,5], {name:'', size:1,visible:false, fixed:true}); 
var p2 = board.create('point', [2,5], {name:'',size:1, visible:false, fixed:true}); 
var p3 = board.create('point', [2,4], {name:'', size:1,visible:false, fixed:true}); 
var p4 = board.create('point', [2,6], {name:'',size:1, visible:false, fixed:true}); 
var li1 = board.create('segment', [p1, p2], {strokeColor: '#AE181E', strokeWidth:2}); 
var li2 = board.create('segment', [p3, p4], {strokeColor: '#AE181E', strokeWidth:2}); 
var seg1 = board.create('segment', [[2,4],[2,6]],{strokeColor: '#5F9EA0'}); 
var p5 = board.create('point', [2.2,4], {name:'', visible:false, fixed:true}); 
var p6 = board.create('point', [3.2,4], {name:'', visible:false, fixed:true}); 
var d = [];
d[0] = board.create('glider', [seg1],{name:'',strokeColor:'#5F9EA0',fillColor:'#5F9EA0'});
d[1] = board.create('point', [2.2, 4], {name:'', visible: false, fixed:false}); 
d[2] = board.create('point', [3.2, 4], {name:'', visible: false, fixed:false});
d[3] = board.create('text', [3.5, 4, "$B$"]);
d[4] = board.create('text', [2.7, 4.2, "$C$"]); 

board.create('segment', [d[1], d[2]]);

var gr = board.create('group', d);

至少，我希望你希望结构像这样工作，你的图像链接似乎不起作用。

关于 MathJax / LaTeX：请在您的文件头中包括：

<script>
window.MathJax = {
  tex: {
    inlineMath: [ ['$','$'], ["\\(","\\)"] ],
    displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
    packages: ['base', 'ams']
  },
  options: {
    ignoreHtmlClass: 'tex2jax_ignore',
    processHtmlClass: 'tex2jax_process'
  }
};
</script>
<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js" id="MathJax-script"></script>