多系列数据Highcharts线答案

【问题标题】：Multiple series data Highcharts line多系列数据Highcharts线
【发布时间】：2016-04-21 19:23:33
【问题描述】：

我使用显示 3 列（国家、日期、项目）的查询结果。我的php代码端

 $res = db_query($sql);
$dat = array(); 
while($r = db_fetch_array($res)){
    $dat[]= array($r['date'], $r['items'], $r['country']);
}

// Armar
$start_date = '';
if(count($dat)>0){
    $s = split(' ',$dat[0][0]);
    $ss = split('-',$s[0]);
}
// Cada objeto en $dats es una grafica
$dats[] = array('type'=>'line',
            'name'=>$q['title'],
            'pointInterval'=>24 * 3600 * 1000,
            'pointStart'=>mktime(0,0,0,$ss[1],$ss[2],$ss[0])*1000,
            'data'=>$dat) ;
//echo "$sql";
echo json_encode($dats,JSON_NUMERIC_CHECK);

我的 Javascript 代码：

function loadLine(_data){
    $('#line_container').highcharts({
        chart: {zoomType: 'x',spacingRight: 20},
        title: { text: 'Monthly Created items'},
        subtitle: {text:'Updated every day'},
        xAxis: {
            type: 'datetime',
            maxZoom: 7 * 24 * 3600000, // fourteen days
            title: {text: null}
        },
        yAxis: {title: {text: 'Created items'}},
        tooltip: {shared: true},
        legend: {enabled: true},
        plotOptions: {
            area: {
                fillColor: {
                    linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1},
                    stops: [
                        [0, Highcharts.getOptions().colors[0]],
                        [1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
                    ]
                },
                lineWidth: 1,
                marker: {
                    enabled: false
                },
                shadow: false,
                states: {
                    hover: {
                        lineWidth: 1
                    }
                },
                threshold: null
            }
        },
        series: _data
    });
}

而显示的结果是这样的

如何通过我在查询中收到的国家/地区名称更改图表中的“系列 1”？我在查询中的数据的日期直到“四月”（YTD），但图表显示未来几个月，我该如何纠正这个问题？如果我的查询中有超过 1 个国家，我怎么能同时在多个图表行中显示它。提前致谢。

【问题讨论】：

如果下面的答案目前没有解决你的问题，那么请提供_data的内容——你的查询返回到JS的内容是什么？

标签： javascript php json highcharts

【解决方案1】：

您只提供了一个系列，它只会转换为一行。尝试类似：

 $res = db_query($sql);
$dat = array(); 
while($r = db_fetch_array($res)){
    if (!isset($dat[$r['country']])) 
       $dat[$r['country']] = [];

    $dat[$r['country']][] = array($r['date'], $r['items'], $r['country']);
}

// Armar
$start_date = '';
if(count($dat)>0){
    $s = split(' ',$dat[0][0]);
    $ss = split('-',$s[0]);
}
// Cada objeto en $dats es una grafica
$dats = [];
foreach ($dat as $country => $values) {
$dats[] = array('type'=>'line',
            'name'=>$q['title'],
            'pointInterval'=>24 * 3600 * 1000,
            'pointStart'=>mktime(0,0,0,$ss[1],$ss[2],$ss[0])*1000,
            'data'=>$values) ;
}
//echo "$sql";
echo json_encode($dats,JSON_NUMERIC_CHECK);

【讨论】：

【解决方案2】：

您的_data 应该类似于以下内容：

 [{
        name: 'USA',
        data: [[Date.UTC(2013,5,1), 7.0], [Date.UTC(2013,6,1), 5.0]]
    }, {
        name: 'Germany',
        data: [[Date.UTC(2013,5,1), 6.0], [Date.UTC(2013,6,1), 8.0]]
    }, {
        name: 'Japan',
        data: [[Date.UTC(2013,5,1), 7.0], [Date.UTC(2013,6,1), 3.0]]
  }]

所以你需要从你的_data做一些映射

【讨论】：