javascript - JSXGraph - 交叉点和从交叉点创建的多边形

Question

我是 jsxgraph 的新手，对 js 也不太精通，我希望你能为我的问题指出正确的方向。

我正在尝试:1)创建穿过矩形的线的交点(将有大量这样的线)，2)用不同颜色的多边形填充它们之间的空间。

以下是整段代码(由于某种原因，jsfiddle 不想工作!:/): https://jsfiddle.net/czarrna/me55dw4h/4/

不幸的是，我的代码无法工作:/

var typical_mn = board.create('polygon', [t_1, t_2, t_3, t_4], {
  fillColor: '#ff9600',
  withLines: false
});

var p1_1 = board.create('intersection', [l_20, typical_mn, 0], {
  visible: true
});
var p1_2 = board.create('intersection', [l_20, typical_mn, 1], {
  visible: true
});

var p2_1 = board.create('intersection', [l_30, typical_mn, 0], {
  visible: true
});
var p2_2 = board.create('intersection', [l_30, typical_mn, 1], {
  visible: true
});

var p3_1 = board.create('intersection', [l_40, typical_mn, 0], {
  visible: true
});
var p3_2 = board.create('intersection', [l_40, typical_mn, 1], {
  visible: true
});

var pol_20_30 = board.create('polygon', [p1_1, p1_2, p2_1, p2_1], {
  fillColor: '#555',
  withLines: false
});

var pol_30_40 = board.create('polygon', [p2_1, p2_1, p3_1, p3_2], {
  fillColor: '#333',
  withLines: false
});

<script src="http://czarrna.kei.pl/jsxgraph/src/loadjsxgraph.js"></script>
<script src="http://czarrna.kei.pl/jsxgraph/distrib/jsxgraph.css"></script>
<div id="jxgbox" class="jxgbox" style="width: 500px; height: 500px;"></div>

我希望有人能帮我解决这个问题!将感激不尽。谢谢

Answer 1

现在，jsfiddle 中的外部库必须包含在 https 中。 JSXGraph 可通过 https 获取，例如 https://cdnjs.cloudflare.com/ajax/libs/jsxgraph/0.99.3/jsxgraphcore.js .

目前，多边形和直线之间没有相交算法。但可以用直线使多边形边界相交。为此，必须将多边形的 withLines 属性设置为 true。然后可以使用 borders 数组访问边框。

在您的示例中，它看起来像

var typical_mn = board.create('polygon',[t_1,t_2,t_3, t_4], {fillColor:'#ff9600', withLines:true});

in_20 = board.create('intersection', [l_20, typical_mn.borders[0]],{visible:true});
in_30 = board.create('intersection', [l_30, typical_mn.borders[0]],{visible:true});
in_40 = board.create('intersection', [l_40, typical_mn.borders[0]],{visible:true});

直线和多边形之间的相交是一个有趣的功能，我将在 github 上创建一个票证。