1

这是我在单个 grpah 中绘制多行的代码，但它不起作用 

<%@ 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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
    <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 line2 = $.parseJSON(document.getElementById("test").value);
alert(line2);
var mydata = [
];
var mydata1 = [
];
var mydata2 = [
];
for (var i = 0; i < line2.length; i++) {
    //mydata[0].push([line2[i].time,line2[i].valueint]);
    mydata.push(line2[i].time);
    mydata1.push(line2[i].valueint);
    mydata2.push(line2[i].valueint1);
}
console.log(mydata,mydata1); 

$('#container').highcharts({
    title: {
        text: 'Vitals Chart',
        x: -20 //center
    },
    subtitle: {
        text: 'Temperature (°C)',
        x: -20
    },
    xAxis: {
        title: {
            text: 'Date & Time'
        },
        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
        },
        {
        name: 'Temp',
        data: mydata2                   

    }]
});
    });
    </script>
    </head>

    <body>


    <input type="hidden" id="test" value='[{"time":"2013-06-27 20:28:04","valueint":40","valueint1":64},{"time":"2013-07-0110:41:29","valueint":11","valueint1":11},{"time":"2013-07-17 18:55:02","valueint":40","valueint1":43}]
    '>

    <div id="container" style="min-width: 400px; height: 450px; margin: 0 auto"></div>

    </body>
    </html>

如果有人有这个想法，请将此代码更新为 JSFidle.Actuallu 我在 JSP Web 应用程序中这样做

4

1 回答 1

0

它不起作用，因为 Highcharts 使用时间戳（以毫秒为单位的时间），所以像“2013-06-27 20:28:04”这样的日期是不正确的。"valueint":40"有多余的。如果你有一个推送对象，你需要有带值的 y 参数，而不是自定义名称。

于 2013-07-18T09:17:12.500 回答