Difference between revisions of "Polar grid"
From JSXGraph Wiki
Jump to navigationJump to searchA WASSERMANN (talk | contribs) |
A WASSERMANN (talk | contribs) |
||
(13 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
<jsxgraph width="500" height="500"> | <jsxgraph width="500" height="500"> | ||
− | var board = JXG.JSXGraph.initBoard('jxgbox', {axis: | + | var board = JXG.JSXGraph.initBoard('jxgbox', {axis:false, boundingbox:[-5, 5, 5, -5]}); |
+ | |||
+ | // Horizontal axis with polar grid lines | ||
+ | var ax1 = board.create('axis', [[0,0], [1,0]], { | ||
+ | ticks: { | ||
+ | type: 'polar', // Polar grid | ||
+ | label: { // Place the labels centered on the grid lines | ||
+ | offset:[0, -3], | ||
+ | anchorX: 'middle', | ||
+ | anchorY: 'top' | ||
+ | } | ||
+ | } | ||
+ | }); | ||
+ | |||
+ | // Vertical axis with horizontal ticks | ||
+ | var ax2 = board.create('axis', [[0,0], [0,1]], { | ||
+ | ticks: { | ||
+ | majorHeight: 0, // Do not show the grid lines | ||
+ | tickEndings: [1, 0], // Let the ticks point to the left | ||
+ | label: { // Position of the labels | ||
+ | visible: true, | ||
+ | offset: [-6, 0], | ||
+ | anchorY: 'middle', | ||
+ | anchorX: 'right' | ||
+ | } | ||
+ | } | ||
+ | }); | ||
− | |||
</jsxgraph> | </jsxgraph> | ||
===The underlying JavaScript code=== | ===The underlying JavaScript code=== | ||
<source lang="javascript"> | <source lang="javascript"> | ||
+ | var board = JXG.JSXGraph.initBoard('jxgbox', {axis:false, boundingbox:[-5, 5, 5, -5]}); | ||
+ | |||
+ | // Horizontal axis with polar grid lines | ||
+ | var ax1 = board.create('axis', [[0,0], [1,0]], { | ||
+ | ticks: { | ||
+ | type: 'polar', // Polar grid | ||
+ | label: { // Place the labels centered on the grid lines | ||
+ | offset:[0, -3], | ||
+ | anchorX: 'middle', | ||
+ | anchorY: 'top' | ||
+ | } | ||
+ | } | ||
+ | }); | ||
+ | |||
+ | // Vertical axis with horizontal ticks | ||
+ | var ax2 = board.create('axis', [[0,0], [0,1]], { | ||
+ | ticks: { | ||
+ | majorHeight: 0, // Do not show the grid lines | ||
+ | tickEndings: [1, 0], // Let the ticks point to the left | ||
+ | label: { // Position of the labels | ||
+ | visible: true, | ||
+ | offset: [-6, 0], | ||
+ | anchorY: 'middle', | ||
+ | anchorX: 'right' | ||
+ | } | ||
+ | } | ||
+ | }); | ||
</source> | </source> | ||
[[Category:Examples]] | [[Category:Examples]] | ||
[[Category:Calculus]] | [[Category:Calculus]] |
Latest revision as of 11:42, 31 March 2020
The underlying JavaScript code
var board = JXG.JSXGraph.initBoard('jxgbox', {axis:false, boundingbox:[-5, 5, 5, -5]});
// Horizontal axis with polar grid lines
var ax1 = board.create('axis', [[0,0], [1,0]], {
ticks: {
type: 'polar', // Polar grid
label: { // Place the labels centered on the grid lines
offset:[0, -3],
anchorX: 'middle',
anchorY: 'top'
}
}
});
// Vertical axis with horizontal ticks
var ax2 = board.create('axis', [[0,0], [0,1]], {
ticks: {
majorHeight: 0, // Do not show the grid lines
tickEndings: [1, 0], // Let the ticks point to the left
label: { // Position of the labels
visible: true,
offset: [-6, 0],
anchorY: 'middle',
anchorX: 'right'
}
}
});