如何在highcharts系列中使用javascript变量

How to use a javascript variable in highcharts series?

本文关键字:javascript 变量 系列 highcharts      更新时间:2023-09-26

我想在highchart系列中使用javascript变量,但它似乎不起作用:

function groupBar(n) {
	var nu;
	nu = parseInt(n); 
	var series_b_tab =  <?php echo json_encode($series_bar)?>; 
	
	var series_b = series_b_tab[n];
	series_b = series_b.join(",");
		
    $('#bar_project_'+n).highcharts({
      
        chart: {
            type: 'column',
            height : 300,
            width: 500
        },
        title: {
            text: 'Logements connectés'
        },
        subtitle: {
            text: 'Source: Valenciennes Métropole'
        },
        xAxis: {
            categories: [<?php echo join($legend_bar,',') ?>],
            title: {
                text: null
            },
            labels: {
             	rotation: -45,
            	style: {
                    fontSize: '9px'
                }
            }
        },
        yAxis: [
        {
            min: 0,
            //max: 8000,
            labels:{
                style :{
                    color: 'red'
                }
            },
            title: {
                text: 'Nombre de connexions par type',
                align: 'middle'
            },
            labels: {
                overflow: 'justify'
            },
            opposite: true
        },
        // second yAxis
        {
            min: 0,
            //max: 70,
            labels:{
                style :{
                    color: 'red'
                }
            },
            title: {
            	text: 'Pourcentage (%)',
                align: 'middle'
            },
            labels: {
                overflow: 'justify'
            }
        }],
        tooltip: {
            valueSuffix: ' %'
        },
        legend: {
            layout: 'vertical',
            align: 'left',
            verticalAlign: 'top',
            x: 50,
            y: 60,
            floating: true,
            borderWidth: 1,
            backgroundColor: '#FFFFFF',
            shadow: true,
            itemStyle: {
                color: 'black', 
                fontSize: '9px'
            }
        },
        
        plotOptions: {
            series: {
                animation: false
            },
        },
  
        series: [{series_b}]
 
    });
};

当n=1时,series_b_tab[n]的示例如下:

{name:' commitd1: 0', type:'column', yAxis: 1,data: [2436]},{name:' commitd1: 1', type:'column', yAxis: 1,data: [2510,171]}

我不知道如何把series_b的内容串联起来。

也许我可以使用json_parse ?

感谢您的帮助

根据您的代码,您当前的设置是:

series: [{series_b}]

如果您的series_b变量的内容示例是准确的,那么您需要的是:

series: [series_b]

由于每组花括号{}包含一个系列,而您的系列已经封装,因此有多个系列。

您的原始语法只能容纳单个序列,假设该序列没有用花括号括起来。

如果不清楚,只需将示例series_b内容粘贴到series: [{ }]部分中,也粘贴到series: [ ]部分中,并查看两者的区别。

的例子:

Original way:
series: [{
    {
        name : ' Commité : 0', 
        type :'column', 
        yAxis : 1 ,
        data : [2436]
    },{
        name : ' Commité : 1', 
        type :'column', 
        yAxis : 1 ,
        data : [2510,171]
    }
}]

.

Proper way:
series: [{
    name : ' Commité : 0', 
    type :'column', 
    yAxis : 1 ,
    data : [2436]
},{
    name : ' Commité : 1', 
    type :'column', 
    yAxis : 1 ,
    data : [2510,171]
}]

创建一个数组var series=[],并在highcharts中添加你的series

代替

series: [{series_b}]
使用

series:series_b