0

我正在尝试从 Highcharts 获取折线图。我的 JSON 看起来像

[{"Monat":"April","d07geb":1.5},{"Monat":"June","d07geb":0.5},{"Monat":"March","d07geb":0.5},{"Monat":"May","d07geb":0.2}]

Monat 表示月份，我试图在 xAxis 上获得的值。d07geb 是该特定月份的金额。

这条线画得很完美，高图似乎是正确的。但是 xAxis 有数值而不是月份。从 1. Jan 开始，下一个条目是 00:00:00.001。

我对此很陌生。我已经设法使用饼图和柱形图。但是这个让我发疯

    $(function () {
    var chart;
    var myJson =  
[{"Monat":"April","d07geb":1.5},{"Monat":"June","d07geb":0.5},{"Monat":"March","d07geb":0.5},{"Monat":"May","d07geb":0.2}] 
    $(document).ready(function() {

        var options = {
        chart: {
                renderTo: 'container',
                plotBackgroundColor: null,
                plotBorderWidth: null,
                plotShadow: false
            },
            title: {
                text: 'Money per Month'
            },
             xAxis: {
            type: 'datetime'},
            tooltip: {
     formatter: function() {
        return '<b>'+ this.point.name;
     }
  },
            plotOptions: {
                pie: {
                    allowPointSelect: true,
                    cursor: 'pointer',
                    dataLabels: {
                        enabled: true,
                        color: '#000000',
                        connectorColor: '#000000',
                        formatter: function() {
                            return '<b>'+ this.point.name;
                        }
                    }
                }
            },
            series: []

    };

        var seriesNew = {
                type: 'line',
                name: 'value',
                data: []
            };



        jQuery.each(myJson, function (itemNo, item) {
            seriesNew.data.push([
               item.Monat,
               item.d07geb
            ])
        });

        options.series.push(seriesNew);      
        chart = new Highcharts.Chart(options);

    });

});
4

2 回答 2

0

您不能将 x 轴标签和数据值分开吗？

如果这是一个选项，你可以这样做：

http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/line-basic/

        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
                'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },
        series: [{
            name: 'Tokyo',
            data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
        }, {
            name: 'New York',
            data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]
        }, {
            name: 'Berlin',
            data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
        }, {
            name: 'London',
            data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
        }]
于 2013-06-23T13:03:05.370 回答
0

如果您的 xAxis 设置为日期时间，那么您的 JSON 需要 JS 时间戳 (Unixtime*1000)。我建议您使用类别作为 xAxis：

xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
                'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },

然后，您还必须更改 JSON 以提供从 1 月到 12 月排序的 12 个值。

于 2013-06-23T13:06:39.957 回答