1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
|
<html>
<head>
<title>JSXGraph vector element</title>
<link rel="stylesheet" type="text/css" href="/jsxgraph/distrib/jsxgraph.css" />
<script type="text/javascript" src="../src/jsxgraphcore.js"></script>
<script type="text/javascript">
/* <![CDATA[ */
JXG.Options.vector = {
strokeColor: 'black',
strokeWidth: 3,
point: {
visible: false,
name: '',
withLabel: false
}
};
JXG.createVector = function (board, parents, attributes) {
var attr_vector = JXG.copyAttributes(attributes, board.options, 'vector'),
attr_point = JXG.copyAttributes(attributes, board.options, 'vector', 'point'),
attach = parents[0],
direction = parents[1],
len = parents[2],
distance = JXG.Math.Geometry.distance(direction, [0, 0]),
lbyd = len/distance,
end = board.create('point', [function () {
return attach.X() + lbyd*direction[0];
},
function () {
return attach.Y() + lbyd*direction[1];
}], attr_point),
vector = board.create('arrow', [attach, end], attr_vector);
return vector;
};
JXG.JSXGraph.registerElement('vector', JXG.createVector);
/* ]]> */
</script>
</head>
<body>
<h2>Vector</h2>
<div id="jxgbox" class="jxgbox" style="width:800px; height:800px; float:left"></div>
<script type="text/javascript">
/* <![CDATA[ */
var example = (function () {
var board = JXG.JSXGraph.initBoard('jxgbox', {boundingbox:[-4, 6, 10, -4], axis: true, zoom: {wheel: true}, grid: false, keepaspectratio: true, showcopyright: true});
var p = board.create('point', [1, 2]);
var v = board.create('vector', [p, [2, 3], 2]);
})();
/* ]]> */
</script>
</body>
</html>
|
