在HTML中使用Javascript数组
[英]Using Javascript Arrays in html
问题描述
How do I use an element from an array in javascript in html which is declared outside the function? 
如何在函数外部声明的html中的javascript中使用数组中的元素？ I'm trying to use the elements of the array to create a graph but the graph doesnt show up in the webpage, I do not know why. 我正在尝试使用数组的元素来创建图表，但是该图表未显示在网页中，我不知道为什么。
<!DOCTYPE HTML> <html> <head> <title>xyz</title> <script type="text/javascript"> var x1=[],y1=[]; function define(){ x1={"1780330","1716120","1832015","1822602","1878293","1989673","2093379","2121345","2224831","2325575","2387188","2647722"}; y1={"42053.0","51667.5","47647.5","51539.5","49135.3","52750.1","48508.1","42877.4","53483.1","49935.8","45813.1","53521.8"};} window.onload = function () { var chart = new CanvasJS.Chart("chartContainer", { zoomEnabled: true, title:{ text: e11 "vs" e22 }, animationEnabled: true, axisX:{ title: xaxis, valueFormatString: "#", minimum: 1700000, maximum: 2700000 }, axisY:{ title: yaxis, valueFormatString: "#", minimum: 40000, maximum: 55000 }, legend: { verticalAlign: "bottom", horizontalAlign: "left" }, data: [ { type: "scatter", color: "#778899", legendText: "Each circle represents one year", showInLegend: "true", markerType: "circle", toolTipContent: "<span style='\\"'color: CornflowerBlue;'\\"'><strong></strong></span> {x}<br/> <span style='\\"'color: ForestGreen;'\\"'><strong></strong></span> {y}", dataPoints: [ { x: x1[0], y: y1[0] }, { x: x1[1], y: y1[1] }, { x: x1[2], y: y1[2] }, { x: x1[3], y: y1[3] }, { x: x1[4], y: y1[4] }, { x: x1[5], y: y1[5] }, { x: x1[6], y: y1[6] }, { x: x1[7], y: y1[7] }, { x: x1[8], y: y1[8] }, { x: x1[9], y: y1[9] }, { x: x1[10], y: y1[10] }, { x: x1[11], y: y1[11] }, ] } ] }); chart.render(); } </script> <script type="text/javascript" src="C:\\Users\\Rishika\\Downloads\\canvasjs-1.7.0\\canvasjs.min.js"></script> </head> <body> <div id="chartContainer" style="height: 300px; width: 100%;"> </div> </body>
2 个解决方案
解决方案1
2 2015-10-02 15:28:35
I think there may be an issue with how you define your x1, y1 arrays. 我认为您如何定义x1，y1数组可能存在问题。 Arrays use [] , not the {} that Objects use. 数组使用[] ，而不是对象使用的{} 。
Try x1=[...] 尝试x1=[...]
解决方案2
0 已采纳 2015-10-02 16:41:00
<!DOCTYPE HTML> <html> <head> <title>xyz</title> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/canvasjs/1.7.0/canvasjs.min.js"></script> <script type="text/javascript"> var x1=[], y1=[], e11 = "Something", e22 = "something else"; function define(){ x1= [1780330, 1716120, 1832015, 1822602, 1878293, 1989673, 2093379, 2121345, 2224831, 2325575, 2387188, 2647722]; y1=[42053.0, 51667.5, 47647.5, 51539.5, 49135.3, 52750.1, 48508.1, 42877.4, 53483.1, 49935.8, 45813.1, 53521.8]; } window.onload = function () { define(); var chart = new CanvasJS.Chart("chartContainer", { zoomEnabled: true, title:{ text: e11 + " vs " + e22 }, animationEnabled: true, axisX:{ title: "xaxis", valueFormatString: "#", minimum: 1700000, maximum: 2700000 }, axisY:{ title: "yaxis", valueFormatString: "#", minimum: 40000, maximum: 55000 }, legend: { verticalAlign: "bottom", horizontalAlign: "left" }, data: [ { type: "scatter", color: "#778899", legendText: "Each circle represents one year", showInLegend: "true", markerType: "circle", toolTipContent: '<span style="color: CornflowerBlue;"><strong></strong></span> {x}<br/> <span style="color: ForestGreen;"><strong></strong></span> {y}', dataPoints: x1.map(function(d, i) { return {x: d, y: y1[i]};}) } ] } ); chart.render(); } </script> </head> <body> <div id="chartContainer" style="height: 300px; width: 100%;"></div> </body>
There was a ton of stuff that needed fixing. 有很多东西需要修复。 e11 and e22 weren't defined. e11和e22都没有定义。 You never called define to set x1 and y1 . 您从未调用define来设置x1和y1 。 x1 and y1 were filled with strings instead of numbers. x1和y1用字符串而不是数字填充。 Your tooltipcontent option had extra apostrophes. 您的tooltipcontent选项tooltipcontent多余的撇号。 Your axis titles weren't strings. 您的轴标题不是字符串。 All of these things raise errors and prevent the Chart function from finishing. 所有这些都会引发错误并阻止Chart函数完成。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.