如何在高图表中传递数组? [英] How to pass array in highchart ??

查看:74
本文介绍了如何在高图表中传递数组?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我刚开始使用highcharts,这里我被卡住了 -



我有2个数组,名称为 - js_platform,js_totalTest ,它是从数据库中提取的。



生成图表的代码是 -

 <!DOCTYPE html> 
< body>
< script src =http://code.jquery.com/jquery-1.11.0.min.js>< / script>
< script src =http://code.highcharts.com/highcharts.js>< / script>
< script src =http://code.highcharts.com/modules/exporting.js> < /脚本>
< script>
$(function(){
js_platform =<?php echo json_encode($ platform);?>;
js_totalTest =<?php echo json_encode($ totalTest);?> ;;
$('#container')。highcharts({
图表:{
类型:'列'
},
title:{


xAxis:{
类别:js_platform
},
yAxis:{
分钟: 0,
title:{
text:'总水果消耗'
},
stackLabels:{
启用:true,
风格:{
fontWeight:'bold',
color:(Highcharts.theme&& Highcharts.theme.textColor)||'gray'
}
}
},
legend:{
align:'right',
x:-70,
verticalAlign:'top',
y:20,
floating:true,
backgroundColor:(Highcharts.theme&& Highcharts.theme.legendBackgroundColorSolid)|| 'white',
borderColor:'#CCC',
borderWidth:1,
shadow:false
},
工具提示:{
formatter:function (){
return'< b>'+ this.x +'< / b>< br />'+
this.series.name +':'+ this.y +'< br />'+
'总计:'+ this.point.stackTotal;

$ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $'
color:(Highcharts.theme&& Highcharts.theme.dataLabelsColor)|| 'white',
style:{
textShadow:'0 0 3px black,0 0 3px black'
}
}
}
},
系列:[{
name:'John',
data:[5,3,4,7,2]
},{
name:'Jane' ,
data:[2,2,3,2,1]
},{
名称:'Joe',
数据:[3,4,4,2, 5]
}]
});
});
< / script>

< div id =containerstyle =min-width:310px; height:400px; margin:0 auto>< / div>

< / body>
< / html>

现在我想发送 js_totalTest 的数组值。

在这里,如果我做了类似于 **系列:[{data:[js_totalTest]}] ** ,它不显示任何东西。



我该怎么做?
请指导

解决方案

执行类似 -

 系列:
[{
data:[<?php echo join($ totalTest,',')?>]
}]

请参阅链接( http://www.highcharts.com/docs/working-with-data/preprocessing-data-from-a-database

I have just started using highcharts and here I am stuck -

I have 2 array named - js_platform, js_totalTest , which I am fetching from the database.

The code to generate chart is -

<!DOCTYPE html>
    <body>
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script src="http://code.highcharts.com/highcharts.js"></script>
    <script src="http://code.highcharts.com/modules/exporting.js"> </script>
    <script>
$(function () {
    js_platform = <?php echo json_encode($platform); ?>;
    js_totalTest = <?php echo json_encode($totalTest); ?>;
        $('#container').highcharts({
            chart: {
                type: 'column'
            },
            title: {
                text: 'Overall avalibility of testcases on each platform'
            },
            xAxis: {
                categories: js_platform
            },
            yAxis: {
                min: 0,
                title: {
                    text: 'Total fruit consumption'
                },
                stackLabels: {
                    enabled: true,
                    style: {
                        fontWeight: 'bold',
                        color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
                    }
                }
            },
            legend: {
                align: 'right',
                x: -70,
                verticalAlign: 'top',
                y: 20,
                floating: true,
                backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColorSolid) || 'white',
                borderColor: '#CCC',
                borderWidth: 1,
                shadow: false
            },
            tooltip: {
                formatter: function() {
                    return '<b>'+ this.x +'</b><br/>'+
                        this.series.name +': '+ this.y +'<br/>'+
                        'Total: '+ this.point.stackTotal;
                }
            },
            plotOptions: {
                column: {
                    stacking: 'normal',
                    dataLabels: {
                        enabled: true,
                        color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
                        style: {
                            textShadow: '0 0 3px black, 0 0 3px black'
                        }
                    }
                }
            },
            series: [{
                name: 'John',
                data: [5, 3, 4, 7, 2]
            }, {
                name: 'Jane',
                data: [2, 2, 3, 2, 1]
            }, {
                name: 'Joe',
                data: [3, 4, 4, 2, 5]
            }]
        });
    });
    </script>

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

</body>
</html>

Now for the series I want to send the array values of js_totalTest.

Here if i do something like **series: [{data: [js_totalTest]}]** , it does not display anything.

How I can do this ? Please guide.

解决方案

Do something like -

series: 
    [{
        data:  [<?php echo join($totalTest, ',') ?>]
    }]

Refer to the link (http://www.highcharts.com/docs/working-with-data/preprocessing-data-from-a-database)

这篇关于如何在高图表中传递数组?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆