在HTML中使用Javascript數組
[英]Using Javascript Arrays in html
問題描述
如何在函數外部聲明的html中的javascript中使用數組中的元素？ 我正在嘗試使用數組的元素來創建圖表，但是該圖表未顯示在網頁中，我不知道為什么。
<!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
我認為您如何定義x1，y1數組可能存在問題。 數組使用[] ，而不是對象使用的{} 。
嘗試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>
有很多東西需要修復。 e11和e22都沒有定義。 您從未調用define來設置x1和y1 。 x1和y1用字符串而不是數字填充。 您的tooltipcontent選項tooltipcontent多余的撇號。 您的軸標題不是字符串。 所有這些都會引發錯誤並阻止Chart函數完成。
HTML 表使用 Javascript Arrays
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.