Working with layers - Revision history

A WASSERMANN at 13:38, 10 May 2021

2021-05-10T13:38:47Z

← Older revision		Revision as of 13:38, 10 May 2021
Line 33:		Line 33:
	<source lang="javascript">		<source lang="javascript">
	// Reordering of the layers:		// Reordering of the layers:
	JXG.Options.layer['point'] = 7;		JXG.Options.layer.point = 7;
	JXG.Options.layer['line'] = 9;		JXG.Options.layer.line = 9;

	// A simple construction, consisting of three points , two lines, one circle.		// A simple construction, consisting of three points , two lines, one circle.
Line 43:		Line 43:
	var l1 = brd.create('line',[p1,p2]);		var l1 = brd.create('line',[p1,p2]);
	var l2 = brd.create('line',[p1,p3]);		var l2 = brd.create('line',[p1,p3]);
	var c = brd.create('circle',[p2,p3]);		var c = brd.create('circle',[p2,p3], {layer: 2});
	</source>		</source>
	In the example above the layers have to be changed BEFORE the initialization of the board.		In the example above the layers have to be changed BEFORE the initialization of the board.
Line 51:		Line 51:

	// Reordering of the layers:		// Reordering of the layers:
	brd.options.layer['point'] = 7;		brd.options.layer.point = 7;
	brd.options.layer['line'] = 9;		brd.options.layer.line = 9;

	var p1 = brd.create('point',[3,0]);		var p1 = brd.create('point',[3,0]);
Line 59:		Line 59:
	var l1 = brd.create('line',[p1,p2]);		var l1 = brd.create('line',[p1,p2]);
	var l2 = brd.create('line',[p1,p3]);		var l2 = brd.create('line',[p1,p3]);
	var c = brd.create('circle',[p2,p3]);		var c = brd.create('circle',[p2,p3], {layer: 2});
	</source>		</source>

A WASSERMANN at 16:59, 18 December 2009

2009-12-18T16:59:59Z

@@ Line 45: / Line 45: @@
 var c = brd.create('circle',[p2,p3]);
 </source>
 [[Category:Examples]]

A WASSERMANN: New page: // Reordering of the layers: JXG.Options.layer['point'] = 7; JXG.Options.layer['line'] = 9; // A simple construction, consisting of three points , two ...

2009-12-18T16:57:13Z

New page: <jsxgraph width="600" height="600"> // Reordering of the layers: JXG.Options.layer['point'] = 7; JXG.Options.layer['line'] = 9; // A simple construction, consisting of three points , two ...

New page

<jsxgraph width="600" height="600">
// Reordering of the layers:
JXG.Options.layer['point'] = 7;
JXG.Options.layer['line'] = 9;

// A simple construction, consisting of three points , two lines, one circle.
var brd = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-5, 5, 5, -5], grid: false});
var p1 = brd.create('point',[3,0]);
var p2 = brd.create('point',[-1,0]);
var p3 = brd.create('point',[0,4]);
var l1 = brd.create('line',[p1,p2]);
var l2 = brd.create('line',[p1,p3]);
var c = brd.create('circle',[p2,p3]);
</jsxgraph>

===The JavaScript code===
Here are the default layers of the JSXGraph geometry elements. High values mean "laying on top".
<source lang="javascript">
layer : {
point : 9,
arc : 8,
line : 7,
circle: 6,
curve : 5,
polygon: 4,
sector: 3,
angle : 2,
grid : 1,
image : 0
}
</source>
Here we change the layers of points and lines:
<source lang="javascript">
// Reordering of the layers:
JXG.Options.layer['point'] = 7;
JXG.Options.layer['line'] = 9;

// A simple construction, consisting of three points , two lines, one circle.
var brd = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-5, 5, 5, -5], grid: false});
var p1 = brd.create('point',[3,0]);
var p2 = brd.create('point',[-1,0]);
var p3 = brd.create('point',[0,4]);
var l1 = brd.create('line',[p1,p2]);
var l2 = brd.create('line',[p1,p3]);
var c = brd.create('circle',[p2,p3]);
</source>
[[Category:Examples]]