Question

我需要绘制一个图表，显示代表员工在广告系列上所做的更改时用户数量的变化（增加或减少），为此我维护员工活动的更改日志。所以我需要在每个x轴系列上绘制x轴线。

我搜索过但却找不到合适的答案。这个Js Fiddle在x轴上只绘制了一条线，但我需要在每个x轴系列上都有线。

可能有一个结果，但需要为我需要的每一行生成情节对象。

> function_name(my_dataframe,"ID_col","names_col")
      N
FU181 2
FU901 1
FU992 1

Answer 1

是的，您需要自己生成plotlines数组，其值与数据的x值相匹配。由于您使用的是日增量，因此对绘图线使用相同的内容。

http://jsfiddle.net/8mn674ch/1/

var data = [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4];
var plotlines = [];
//var startTime = Date.UTC(2010, 0, 1).getTime();
var startTime = new Date(Date.UTC(2010, 0, 1)).getTime();
for(var i = 0; i < data.length; i++) {
    var timeincr = startTime + 1000*3600*24*i;
  console.log(new Date(timeincr));
    var pline = { // mark the weekend
            color: 'red',
            width: 2,
            value: timeincr,
            events: {
                click: function () {
                    $report.html('click');
                },
                mouseover: function () {
                    $report.html('mouseover');
                },
                mouseout: function () {
                    $report.html('mouseout');
                }
            }
        };
    plotlines.push(pline);
}
Highcharts.chart('container', {
    xAxis: {
        plotLines: plotlines,
        tickInterval: 24 * 3600 * 1000,
        // one day
        type: 'datetime'
    },

    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4],
        pointStart: Date.UTC(2010, 0, 1),
        pointInterval: 24 * 3600 * 1000
    }]
});

Answer 2

迟到的答案，但您可以通过更改刻度线位置在每个 x 轴系列上画线：

xAxis: {
        tickWidth: 1,
        tickmarkPlacement: 'on',
        gridLineWidth: 1
    }

在x轴Highcharts上绘制多条线

2 个答案: