JSChart 怎么画两条折线图-JavaSript-爱易网页

JSChart 怎么画两条折线图

日期：2014-05-16　浏览次数：20426 次

JSChart 如何画两条折线图
JSchart 为何只能显示一条折线图？



<script type="text/javascript">

	var myData = new Array([1997, 7.80,8.90], [1998, 4.80,8.60], [1999, 6.50,4.80], [2000, 6.10,6.50], [2001, 4.40,4.40], [2002, 5.80,6.10], [2003, 4.00,6.10], [2004, 8.50,6.10], [2005, 8.90,6.10], [2006, 9.20,6.10]);

	var myChart = new JSChart('graph', 'line');

	myChart.setDataArray(myData);

	myChart.setTitle('India GDP');

	myChart.setTitleColor('#8E8E8E');

	myChart.setTitleFontSize(11);

	myChart.setAxisNameX('');

	myChart.setAxisNameY('');

	myChart.setAxisColor('#8420CA');

	myChart.setAxisValuesColor('#949494');

	myChart.setAxisPaddingLeft(100);

	myChart.setAxisPaddingRight(120);

	myChart.setAxisPaddingTop(50);

	myChart.setAxisPaddingBottom(40);

	myChart.setAxisValuesDecimals(3);

	myChart.setAxisValuesNumberX(10);

	myChart.setShowXValues(false);

	myChart.setGridColor('#C5A2DE');

	myChart.setLineColor('#BBBBBB');

	myChart.setLineWidth(2);

	myChart.setFlagColor('#9D12FD');

	myChart.setFlagRadius(4);

	myChart.setTooltip([1997, 'GDP 7.80']);

	myChart.setTooltip([1998, 'GDP 4.80']);

	myChart.setTooltip([1999, 'GDP 6.50']);

	myChart.setTooltip([2000, 'GDP 6.10']);

	myChart.setTooltip([2001, 'GDP 4.40']);

	myChart.setTooltip([2002, 'GDP 5.80']);

	myChart.setTooltip([2003, 'GDP 4.00']);

	myChart.setTooltip([2004, 'GDP 8.50']);

	myChart.setTooltip([2005, 'GDP 8.90']);

	myChart.setTooltip([2006, 'GDP 9.20']);

	myChart.setLabelX([1997, '1997']);

	myChart.setLabelX([1998, '1998']);

	myChart.setLabelX([1999, '1999']);

	myChart.setLabelX([2000, '2000']);

	myChart.setLabelX([2001, '2001']);

	myChart.setLabelX([2002, '2002']);

	myChart.setLabelX([2003, '2003']);

	myChart.setLabelX([2004, '2004']);

	myChart.setLabelX([2005, '2005']);

	myChart.setLabelX([2006, '2006']);

	myChart.setSize(616, 321);

	myChart.draw();

</script>

JSchart?折线图

------解决方案--------------------
参照官方的例子即可
example-3

<html>

<head>



<title>JSChart</title>



<script type="text/javascript" src="../../../sources/jscharts.js"></script>



</head>

<body>



<div id="graph">Loading graph...</div>



<script type="text/javascript">

	var myChart = new JSChart('graph', 'line');

	myChart.setDataArray([[1, 80],[2, 40],[3, 60],[4, 65],[5, 50],[6, 50],[7, 60],[8, 80],[9, 150],[10, 100]], 'blue');

	myChart.setDataArray([[1, 100],[2, 55],[3, 80],[4, 115],[5, 80],[6, 70],[7, 30],[8, 130],[9, 160],[10, 170]], 'green');

	myChart.setDataArray([[1, 150],[2, 25],[3, 100],[4, 80],[5, 20],[6, 65],[7, 0],[8, 155],[9, 190],[10, 200]], 'gray');

	myChart.setAxisPaddingBottom(40);

	myChart.setTextPaddingBottom(10);

	myChart.setAxisValuesNumberY(5);

	myChart.setIntervalStartY(0);

	myChart.setIntervalEndY(200);

	myChart.setLabelX([2,'p1']);

	myChart.setLabelX([4,'p2']);

	myChart.setLabelX([6,'p3']);

	myChart.setLabelX([8,

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

JSChart 怎么画两条折线图

相关资料更多>

推荐阅读更多>