javascript - 在 HighCharts 的条形图中显示数组值

标签 javascript highcharts

我正在尝试显示我动态获取的值。在下面的代码中,我尝试将值存储在数组中,并且尝试使用“series: data”中的数组值。 图表中没有显示任何内容。 我知道这是一个非常简单的问题,但当我用谷歌搜索时没有得到任何令人满意的答案。请帮忙

var x = window.location.search.replace( "?", "" );
        x = x.substring(3);
        var array = x.split(",");  // I am storing my dynamic values in  this array


$(function () {
        //alert(array);   ----- I am able to see the values here 
        $('#container').highcharts({
            chart: {
                type: 'bar'
            },
            title: {
                text: 'Wireless Experience Meter'
            },
            subtitle: {
                text: 'Sub - Time to Download'
            },
            xAxis: {
                categories: ['Text'],
                title: {
                    text: null
                }
            },
            yAxis: {
                min: 0,
                title: {
                    text: 'Time (ms)',
                    align: 'high'
                },
                labels: {
                    overflow: 'justify'
                }
            },
            tooltip: {
                valueSuffix: ' ms'
            },
            plotOptions: {
                bar: {
                    dataLabels: {
                        enabled: true
                    }
                }
            },
            legend: {
                layout: 'vertical',
                align: 'right',
                verticalAlign: 'top',
                x: -40,
                y: 100,
                floating: true,
                borderWidth: 1,
                backgroundColor: '#FFFFFF',
                shadow: true
            },
            credits: {
                enabled: false
            },
            series: [{
                name: 'Attempt 1',
                //data: [635, 203, 200] 
                data : [array[0]]   // I need to pass the variables here to get it displayed 
            }, {
                name: 'Attempt 2',
                //data: [133, 408, 698]
                data : [array[1]]
            }, {
                name: 'Attempt 3',
                //data: [973, 914, 4054]
                data : [array[2]]
            }]
        });
    });

最佳答案

您没有告诉我们变量 array 等于什么,但由于它是从 x.split(",") 生成的,因此它的元素将是字符串,并且不是 Highcharts 需要的数值。

因此使用 parseIntparseFloat 进行转换:

var numericData = [];
for (var i = 0; i < array.length; i++){
   numericData.push(parseFloat(array[i]));
}
...
series: [{
   name: 'Attempt 1',
   data : numericData 
},
...

关于javascript - 在 HighCharts 的条形图中显示数组值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20437817/

相关文章:

Javascript 在控制台上获取不应该的未定义数据

javascript - return 将值返回给谁(javascript)?

javascript - 如何在 Highcharts 中制作响应式标题?

javascript - 当按下 Flutter 中的按钮时,是否可以从 .js 或 .py 文件运行 js 或 python 脚本? (不是 Flutter Web)

javascript - 提交表单后显示一个div并保留表单的信息

javascript - 使用 Grunt 的多个文件夹和文件

javascript - highcharts 重绘和回流不起作用

javascript - 如何模拟 Highchart 上的点击

javascript - highcharts 热图未捕获类型错误 : Cannot read property 'prototype' of undefined

javascript - 如何使用向下钻取功能制作 Highcharts 箱线图?