0

我正在尝试添加 3 个 Y 轴,因此每个数据系列都有 1 个 Y 轴。

这是我的 JSON,它是有效的:

[{“ name”:“ data1”,“数据”:[[13615740000,121201],[13620060000,122019],[1363388400000,122788],[1363820400000,123740],[1363820400000,123740] ,[1365544800000,126553],[1366063200000,127496],[1366668000000,128500],[1367272800000,129433],[1368309600000,130277],[1368655200000,131267],[1369346400000,132191],[1369864800000,133143]]} ,{"name":"data2","data":[[1361574000000,0],[1362006000000,40.6],[1363388400000,35.7],[1363820400000,41.24],[1364511600000,40.56],[1360000,40.56],[1365.16] ,[1365544800000,39.8],[1366063200000,40.58],[136666680000,40.79],[1367272800000,38.06],[1368309600000,000,37.95] ,{"name":"data3","data":[[1361574000000,0],[1362006000000,1.46],[1363388400000,1.42],[1363820400000,1.42],[1364511600000,1.37],[1365112800000,1.41],[1365544800000,1.41],[1366606063200000,1.35] ,1.36],[1369346400000,1.37],[1369864800000,1.359]]},{"name":"data4","data":[[1361574000000,0],[1362006000000,59.276],[13633884]400000,506. [1363820400000,58.5608],[1364511600000,55.5672],[1365112800000,54.9336],[1365544800000,56.118],[1366063200000,54.783],[1366668000000,59.1455],[1367272800000,51.7616],[1368309600000,51.612],[1368655200000 ,56.1816],[1369346400000,55.0192],[1369864800000,52.71561]]}]“ data4”,“数据”:[[13615740000,0],[1362006000000,59.276],[1363338400000,50.694],[1363820400000,000,58.5608] ,[136063200000,54.783],[13666680000,59.1455],[1367272800000,51.7616],[1368309600000,51.612]“ data4”,“数据”:[[13615740000,0],[1362006000000,59.276],[1363338400000,50.694],[1363820400000,000,58.5608] ,[136063200000,54.783],[13666680000,59.1455],[1367272800000,51.7616],[1368309600000,51.612]

JS代码

$(function() {

    $.getJSON('testdata.php', function(data) {
        // Create the chart
        $('#container').highcharts('StockChart', {


            title : {
                text : 'Temperature'
            },

            yAxis: [{
                title: {
                    text: 'A'
                }
            }, {
                title: {
                    text: 'B'
                }
            }, {
                title: {
                    text: 'C'
                }
            }, {
                title: {
                    text: 'D'
                }
            }],

            series: [{
                type: 'line',
                name: 'data1',
                data: data1,
        yAxis: 1,
                }
            }, {
                type: 'line',
                name: 'data2',
                yAxis: 2,
                data: data2
            }, {
                type: 'line',
                name: 'data3',
                yAxis: 3,
                data: data3
        }, {
                type: 'line',
                name: 'data4',
                yAxis: 4,
                data: data4
             }]
    });
   });
});

但是,一旦我添加了多个 Y 轴,图表就不会加载。我究竟做错了什么?

4

2 回答 2

1

yAxis 以 0 开头,而不是 1,因此您尝试将最后一个系列设置为不存在的系列。

          [{  

           ...

          } ,{
            type: 'line',
            name: 'data4',
            yAxis: 4, // max is 3
            data: data4
         }]

第二个问题是将选项更改为正确的格式(被系列名称弄错了):

          [{  

           ...

          } ,{
            type: 'line',
            name: 'data4',
            yAxis: 3,
            data: data[3].data //
         }]
于 2013-06-06T12:33:00.343 回答
0

它现在终于起作用了!谢谢!!

工作代码(结合上面已经提到的 JSON):

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Highcharts Example</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script src="http://code.highcharts.com/stock/highstock.js"></script>
    <script src="http://code.highcharts.com/stock/modules/exporting.js"></script>
    <script type="text/javascript">
$(function() {

    $.getJSON('testdata.php', function(data) {
        // Create the chart
        $('#container').highcharts('StockChart', {


            title : {
                text : 'Temperature'
            },

            yAxis: [{
                title: {
                    text: 'A'
                }
            }, {
                title: {
                    text: 'B'
                }
            }, {
                title: {
                    text: 'C'
                }
            }, {
                title: {
                    text: 'D'
                }
            }],

            series: [{
                type: 'line',
                name: 'data1',
                yAxis: 0,
                data: data[0].data,
            }, {
                type: 'line',
                name: 'data2',
                yAxis: 1,
                data: data[1].data
            }, {
                type: 'line',
                name: 'data3',
                yAxis: 2,
                data: data[2].data
            }, {
                type: 'line',
                name: 'data4',
                yAxis: 3,
                data: data[3].data
             }]
    });
   });
});
        </script>
    </head>
    <body>
    <div id="container" style="height: 500px; min-width: 500px"></div>
    </body>
</html>
于 2013-06-17T15:24:29.417 回答