Difference between revisions of "Fine tuning of labels"
From JSXGraph Wiki
Jump to navigationJump to searchA WASSERMANN (talk | contribs) |
A WASSERMANN (talk | contribs) |
||
(2 intermediate revisions by the same user not shown) | |||
Line 24: | Line 24: | ||
}); | }); | ||
− | var | + | var p2 = board.create('point', [2, 3], |
− | {size: | + | {size:5, |
− | |||
label: { | label: { | ||
− | offset: [0, | + | offset: [0, 10], |
anchorX: 'middle', | anchorX: 'middle', | ||
anchorY: 'bottom', | anchorY: 'bottom', | ||
Line 38: | Line 37: | ||
===The underlying JavaScript code=== | ===The underlying JavaScript code=== | ||
+ | |||
+ | <source lang="css"> | ||
+ | .myLabel { | ||
+ | border: 1px solid black; | ||
+ | border-radius: 3px; | ||
+ | padding: 2px; | ||
+ | } | ||
+ | </source> | ||
<source lang="javascript"> | <source lang="javascript"> | ||
+ | var board = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-5, 5, 5, -1], | ||
+ | axis: true, showcopyright: true, shownavigation: true}); | ||
+ | |||
+ | var p1 = board.create('point', [-2, 3], | ||
+ | {size:20, | ||
+ | fillColor: 'none', | ||
+ | label: { | ||
+ | offset: [0, 0], | ||
+ | anchorX: 'middle', | ||
+ | anchorY: 'middle', | ||
+ | } | ||
+ | }); | ||
+ | |||
+ | var p2 = board.create('point', [2, 3], | ||
+ | {size:5, | ||
+ | label: { | ||
+ | offset: [0, 10], | ||
+ | anchorX: 'middle', | ||
+ | anchorY: 'bottom', | ||
+ | cssClass: 'myLabel', | ||
+ | highlightCssClass: 'myLabel' | ||
+ | } | ||
+ | }); | ||
</source> | </source> | ||
+ | |||
[[Category:Examples]] | [[Category:Examples]] | ||
[[Category:Text]] | [[Category:Text]] |
Latest revision as of 12:24, 9 April 2014
Center the position of labels and use custum CSS styles for labels.
The underlying JavaScript code
.myLabel {
border: 1px solid black;
border-radius: 3px;
padding: 2px;
}
var board = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-5, 5, 5, -1],
axis: true, showcopyright: true, shownavigation: true});
var p1 = board.create('point', [-2, 3],
{size:20,
fillColor: 'none',
label: {
offset: [0, 0],
anchorX: 'middle',
anchorY: 'middle',
}
});
var p2 = board.create('point', [2, 3],
{size:5,
label: {
offset: [0, 10],
anchorX: 'middle',
anchorY: 'bottom',
cssClass: 'myLabel',
highlightCssClass: 'myLabel'
}
});