0

这是在jsp中生成图形的代码。但是代码会失败。实际上我使用highchart开发图形，但显示错误.. 

<%@ page contentType="text/html; charset=iso-8859-1" language="java" import="java.sql.*" errorPage="" %>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<script>
$(document).ready(function() {
var line2=$.parseJSON(document.getElementById("test").value);

  var mydata = [[]];
  var mydata1 = [[]];
  for(var i=0; i<line2.length; i++) 
  {
        //mydata[0].push([line2[i].time,line2[i].valueint]);
        mydata[0].push([line2[i].time]);
        mydata1[0].push([line2[i].valueint]);
  }
  alert(mydata);
  alert(mydata1);
    $('#container').highcharts({
        title: {
            text: 'Monthly Average Temperature',
            x: -20 //center
        },
        subtitle: {
            text: 'Source: WorldClimate.com',
            x: -20
        },
        xAxis: {
            categories: mydata
        },
        yAxis: {
            title: {
                text: 'Temperature (°C)'
            },
            plotLines: [{
                value: 0,
                width: 1,
                color: '#808080'
            }]
        },
        tooltip: {
            valueSuffix: '°C'
        },
        legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'middle',
            borderWidth: 0
        },
        series: [{
            name: 'Temp',
            data: mydata1

        }]
    });
});

</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<body>
<input type="hidden" id ="test" value='[{"time":"2013-07-02 18:33:52","valueint":25.000},{"time":"2013-07-02 18:34:22","valueint":27.000},{"time":"2013-07-02 18:34:52","valueint":25.000}]'>
 <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
 </body>
 </html>

实际上这是我的代码..但不是根据时间与温度生成图表..警报已生成但不在图表中，请更新此代码。

4

1 回答 1

0

两件事情：

  • 类别应该是一个字符串数组，所以：

    • 在这里删除额外的数组：var mydata = [[]];-> var mydata = [];
    • 在这里删除额外的数组： mydata[0].push([line2[i].time]);-> mydata.push(line2[i].time);

  • data 应该是一个数字数组，因此删除额外数组的方式与类别相同。

于 2013-07-17T11:34:42.200 回答