如何绘制三个值绘制二次曲线?

时间:2016-08-13 09:34:20

标签: javascript jquery



<!doctype>
<html>
<head>
<link type="text/css" rel="stylesheet" href="rickshawmmm/src/css/graph.css">
<link type="text/css" rel="stylesheet" href="rickshawmmm/examples/css/lines.css">

<script src="rickshawmmm/vendor/d3.v3.js"></script>

<script src="rickshawmmm/rickshaw.js"></script>

<style>
#chart {
	position: relative;
	left: 40px;
}
#y_axis {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 40px;
}
#x_axis {
	position: relative;
	left: 40px;
	height: 40px;
}


</style>
</head>
<body>
<div id="chart_container">
	<div id="y_axis"></div>
	<div id="chart"></div>
	<div id="x_axis"></div>
</div>

<div>
	<button onclick="window.showTextOnOtherSide()">Change text location</button>
	<button onclick="window.setSize()">setSize()</button>
</div>

<script>

// instantiate our graph!

var graph = new Rickshaw.Graph( {
	element: document.getElementById("chart"),
	renderer: 'line',
	height: 300,
	width: 800,
	series: [
		{
			data: [ { x: 0, y: 800 }, { x: 1, y: 200 }, { x: 2, y: 800 }, { x: 3, y: 70 }, { x: 4, y: 32 } ],
			color: "#c05020"
		}, 
	]
} );

var y_ticks = new Rickshaw.Graph.Axis.Y( {
	graph: graph,
	orientation: 'left',
	tickFormat: Rickshaw.Fixtures.Number.formatKMBT,
	element: document.getElementById('y_axis')
} );

graph.render();

window.showTextOnOtherSide = function() {
	y_ticks.orientation = y_ticks.orientation === 'right' ? 'left' : 'right';
	graph.render();
};

window.setSize = function() {
	var width = parseInt(prompt('New axis width?', y_ticks.width), 10);
	var height = parseInt(prompt('New axis height?', y_ticks.height), 10);
	y_ticks.setSize({
		width: width,
		height: height
	});
};
var format = function(n) {

	var map = {
		0: 'zero',
		1: 'first',
		2: 'second',
		3: 'third',
		4: 'fourth'
	};

	return map[n];
}

var x_ticks = new Rickshaw.Graph.Axis.X( {
	graph: graph,
	orientation: 'bottom',
	element: document.getElementById('x_axis'),
	pixelsPerTick: 200,
	tickFormat: format
} );
graph.render();
</script>
</body>
</html>
&#13;
&#13;
&#13;

我有一些代码我尝试在数组方法中绘制曲线,但我想如何基于三个值绘制二次曲线,例如5x ^ 2 + 8x-6; a = 5,b = 8, c = -6在三个值的基础上如何绘制二次方程请帮帮我。

0 个答案:

没有答案