Circle with ticks - Revision history

A WASSERMANN at 22:05, 24 March 2014

2014-03-24T22:05:11Z

← Older revision		Revision as of 22:05, 24 March 2014
Line 1:		Line 1:
	Show ticks on the circumference of a circle.		Show ticks on the circumference of a circle.
	<jsxgraph width="~~600~~" height="~~500~~">		<jsxgraph width="400" height="400">
	var brd = JXG.JSXGraph.initBoard('jxgbox',{axis:false,boundingbox:[-5,5,5,-5],keepaspectratio:true});		var brd = JXG.JSXGraph.initBoard('jxgbox',{axis:false,boundingbox:[-5,5,5,-5],keepaspectratio:true});

2014-03-24T22:04:50Z

@@ Line 1: / Line 1: @@
 <jsxgraph width="600" height="500">
 var brd = JXG.JSXGraph.initBoard('jxgbox',{axis:false,boundingbox:[-5,5,5,-5],keepaspectratio:true});
@@ Line 45: / Line 46: @@
 <source lang="javascript">
 </source>
 [[Category:Examples]]
 [[Category:Curves]]

2014-03-24T22:03:38Z

← Older revision		Revision as of 22:03, 24 March 2014
Line 6:		Line 6:
	var circ = brd.create('circle', [p, q]);		var circ = brd.create('circle', [p, q]);

			// Create an empty curve
	var ticks = brd.create('curve', [[0], [0]],		var ticks = brd.create('curve', [[0], [0]],
	{strokeWidth: 1,		{strokeWidth: 1,
	strokeColor: 'blue',		strokeColor: 'blue',
	strokeOpacity: 0.5});		strokeOpacity: 0.5});

			// Make ticks out of the curve
	ticks.updateDataArray = function() {		ticks.updateDataArray = function() {
	var cx = circ.center.X(),		var cx = circ.center.X(),
Line 15:		Line 18:
	r = circ.Radius(),		r = circ.Radius(),
	i,		i,
	ticklen = 0.3,		ticklen = 0.3, // Length of ticks in user space coordinates
	steps = 20,		steps = 20, // Number of ticks
	d = ticklen * 0.5,		d = ticklen * 0.5,
	alpha = 2 * Math.PI / steps;		alpha = 2 * Math.PI / steps;
Line 23:		Line 26:
	this.dataY = [];		this.dataY = [];
	for (i = 0; i < steps; i++) {		for (i = 0; i < steps; i++) {
			// Start of a tick
	this.dataX.push( cx + (r - d)* Math.cos(i * alpha) );		this.dataX.push( cx + (r - d)* Math.cos(i * alpha) );
	this.dataY.push( cy + (r - d) * Math.sin(i * alpha) );		this.dataY.push( cy + (r - d) * Math.sin(i * alpha) );
			// End of tick
	this.dataX.push( cx + (r + d) * Math.cos(i * alpha) );		this.dataX.push( cx + (r + d) * Math.cos(i * alpha) );
	this.dataY.push( cy + (r + d) * Math.sin(i * alpha) );		this.dataY.push( cy + (r + d) * Math.sin(i * alpha) );
			// Interrupt the curve
	this.dataX.push( NaN );		this.dataX.push( NaN );
	this.dataY.push( NaN );		this.dataY.push( NaN );

2014-03-24T22:01:05Z

← Older revision		Revision as of 22:01, 24 March 2014
Line 6:		Line 6:
	var circ = brd.create('circle', [p, q]);		var circ = brd.create('circle', [p, q]);

	var ticks = brd.create('curve', [[0], [0]], {strokeWidth: 1, strokeColor: 'blue'});		var ticks = brd.create('curve', [[0], [0]],
			{strokeWidth: 1,
			strokeColor: 'blue',
			strokeOpacity: 0.5});
	ticks.updateDataArray = function() {		ticks.updateDataArray = function() {
	var cx = circ.center.X(),		var cx = circ.center.X(),

2014-03-24T22:00:15Z

← Older revision		Revision as of 22:00, 24 March 2014
Line 12:		Line 12:
	r = circ.Radius(),		r = circ.Radius(),
	i,		i,
			ticklen = 0.3,
	steps = 20,		steps = 20,
			d = ticklen * 0.5,
	alpha = 2 * Math.PI / steps;		alpha = 2 * Math.PI / steps;

Line 18:		Line 20:
	this.dataY = [];		this.dataY = [];
	for (i = 0; i < steps; i++) {		for (i = 0; i < steps; i++) {
	this.dataX.push( cx + 0.95 * r * Math.cos(i * alpha) );		this.dataX.push( cx + (r - d)* Math.cos(i * alpha) );
	this.dataY.push( cy + 0.95 * r * Math.sin(i * alpha) );		this.dataY.push( cy + (r - d) * Math.sin(i * alpha) );
	this.dataX.push( cx + 1.05 * r * Math.cos(i * alpha) );		this.dataX.push( cx + (r + d) * Math.cos(i * alpha) );
	this.dataY.push( cy + 1.05 * r * Math.sin(i * alpha) );		this.dataY.push( cy + (r + d) * Math.sin(i * alpha) );
	this.dataX.push( NaN );		this.dataX.push( NaN );
	this.dataY.push( NaN );		this.dataY.push( NaN );

	}		}

	};		};
			brd.update();


	</jsxgraph>		</jsxgraph>

2014-03-24T21:58:03Z

← Older revision		Revision as of 21:58, 24 March 2014
Line 19:		Line 19:
	for (i = 0; i < steps; i++) {		for (i = 0; i < steps; i++) {
	this.dataX.push( cx + 0.95 * r * Math.cos(i * alpha) );		this.dataX.push( cx + 0.95 * r * Math.cos(i * alpha) );
	this.dataY.push( cx + 0.95 * r * Math.sin(i * alpha) );		this.dataY.push( cy + 0.95 * r * Math.sin(i * alpha) );
	this.dataX.push( cx + 1.05 * r * Math.cos(i * alpha) );		this.dataX.push( cx + 1.05 * r * Math.cos(i * alpha) );
	this.dataY.push( cx + 1.05 * r * Math.sin(i * alpha) );		this.dataY.push( cy + 1.05 * r * Math.sin(i * alpha) );
	this.dataX.push( NaN );		this.dataX.push( NaN );
	this.dataY.push( NaN );		this.dataY.push( NaN );

2014-03-24T21:57:34Z

← Older revision		Revision as of 21:57, 24 March 2014
Line 22:		Line 22:
	this.dataX.push( cx + 1.05 * r * Math.cos(i * alpha) );		this.dataX.push( cx + 1.05 * r * Math.cos(i * alpha) );
	this.dataY.push( cx + 1.05 * r * Math.sin(i * alpha) );		this.dataY.push( cx + 1.05 * r * Math.sin(i * alpha) );
			this.dataX.push( NaN );
			this.dataY.push( NaN );

	}		}

2014-03-24T21:56:49Z

← Older revision		Revision as of 21:56, 24 March 2014
Line 18:		Line 18:
	this.dataY = [];		this.dataY = [];
	for (i = 0; i < steps; i++) {		for (i = 0; i < steps; i++) {
	this.dataX.push( cx + 0.95 * Math.cos(i * alpha) );		this.dataX.push( cx + 0.95 * r * Math.cos(i * alpha) );
	this.dataY.push( cx + 0.95 * Math.sin(i * alpha) );		this.dataY.push( cx + 0.95 * r * Math.sin(i * alpha) );
	this.dataX.push( cx + 1.05 * Math.cos(i * alpha) );		this.dataX.push( cx + 1.05 * r * Math.cos(i * alpha) );
	this.dataY.push( cx + 1.05 * Math.sin(i * alpha) );		this.dataY.push( cx + 1.05 * r * Math.sin(i * alpha) );
	}		}

2014-03-24T21:56:07Z

2014-03-24T21:55:43Z

@@ Line 10: / Line 10: @@
      var cx = circ.center.X(),
          cy = circ.center.Y(),
-         r = circle.Radius();
+         r = circle.Radius(),
 };