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 が datetime に設定されている場合、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 に答える