Polar grid: Difference between revisions
From JSXGraph Wiki
A WASSERMANN (talk | contribs) No edit summary  | 
				A WASSERMANN (talk | contribs) No edit summary  | 
				||
| (One intermediate revision by the same user not shown) | |||
| Line 2: | Line 2: | ||
var board = JXG.JSXGraph.initBoard('jxgbox', {axis:false, boundingbox:[-5, 5, 5, -5]});  | var board = JXG.JSXGraph.initBoard('jxgbox', {axis:false, boundingbox:[-5, 5, 5, -5]});  | ||
var ax1 = board.create('axis', [[0,0], [1,0]], {ticks: {type: 'polar', label: {offset:[0, -3], anchorX: 'middle', anchorY: 'top'}}});  | // Horizontal axis with polar grid lines  | ||
var ax2 = board.create('axis', [[0,0], [0,1]], {ticks: {majorHeight: 0,   | 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>  | ||
| Line 9: | Line 32: | ||
===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 09: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'
        }
    }
});