javascript - highcharts 动态类别不起作用

标签 javascript json highcharts

我正在使用以下方法动态填充 highcharts 中的类别,但它对我不起作用

var weeklyIndicators;
var cats = '';
$.when(
    $.getJSON('weeklyindicators', function(data) {
        weeklyIndicators = data;
    })
).then(function() {


    $.each(weeklyIndicators, function(i, item) {
        if (cats.indexOf(item.indicatorTimestamp) == -1){
            cats += "'" +  item.indicatorTimestamp + "'" + ',';
        }
    });
    cats = cats.substring(0, cats.length - 1);
    console.log(cats);
    // here is the output: '2016-01-30','2016-01-31','2016-02-01','2016-02-02','2016-02-03','2016-02-04','2016-02-05'
    $('#container').highcharts({
        chart: {
            type: 'column'
        },
        title: {
            text: 'Monthly Average Rainfall'
        },
        subtitle: {
            text: 'Source: WorldClimate.com'
        },
        xAxis: {
            categories: [cats],
            crosshair: true
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Rainfall (mm)'
            }
        },
        tooltip: {
            headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
            pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
                '<td style="padding:0"><b>{point.y:.1f} mm</b></td></tr>',
            footerFormat: '</table>',
            shared: true,
            useHTML: true
        },
        plotOptions: {
            column: {
                pointPadding: 0.2,
                borderWidth: 0
            }
        },
        series: [{
            name: 'Tokyo',
            data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6]

        }, {
            name: 'New York',
            data: [83.6, 78.8, 98.5, 93.4, 106.0, 84.5, 105.0]

        }, {
            name: 'London',
            data: [48.9, 38.8, 39.3, 41.4, 47.0, 48.3, 59.0]

        }, {
            name: 'Berlin',
            data: [42.4, 33.2, 34.5, 39.7, 52.6, 75.5, 57.4]

        }]
    });
});

如果我复制/粘贴 console.log 的输出,它工作正常,有什么帮助吗?

下面是截图

enter image description here

此外,我需要该系列充满活力,任何帮助将不胜感激。

最佳答案

用这个

var cats =[]
 $.each(weeklyIndicators, function(i, item) {
    if (cats.indexOf(item.indicatorTimestamp) == -1){
        cats.push(item.indicatorTimestamp);
    }
});

并直接在您的类别中使用此cats数组

categories = cats //not in []

关于javascript - highcharts 动态类别不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35229415/

相关文章:

javascript - 如何切换 ng 类

javascript - React.js 组件有 null 状态?

javascript - AngularJS 货币/数字输出,无需四舍五入

javascript - 解析键值中包含空格的 JSON 对象

javascript - Highcharts:在图例中显示堆叠图表的最后一个值

javascript - 同时在 Highcharts 中显示多个工具提示

javascript - 尝试使用 click 函数替换 html 属性

json - 在 cytoscape.js 中使用 yFiles 布局

javascript - PHP MySQL插入多维关联数组从数组键构建查询

javascript - 未捕获的类型错误 : undefined is not a function when using highcharts