0

我的图表显示得很好，但两条线的颜色相同。如何为两条线指定不同的颜色？到目前为止，这是我的代码（片段）：

config.pointIndex = null;
  config.areaPoints = new Array();
  config.areaPoints[0] = pointsopens;
  config.areaPoints[1] = pointsclicks;
  var plotLinesopen = createPlotlines(pointsopens);
  var plotLinesclick = createPlotlines(pointsclicks);
  var options = {
     chart : { renderTo : 'areaChart' },
     colors: [
        '#4572A7',
        '#AA4643'
        ],
     xAxis: {
        plotLines1: plotLinesopen,
        plotLines2: plotLinesclick
     },
     series : [ data.pointsopens, data.pointsclicks ]
  };
  if (length > 100) {
     options.plotOptions = {
        area : {
           lineWidth: 1,
           marker : { radius : 1 }

        }
     };
  }
  options = jQuery.extend(true, {}, areaChartDefault, options);
  charts.area = new Highcharts.Chart(options);

谢谢你。

PS，我的代码现在是： 

 config.pointIndex = null;
        config.areaPoints = new Array();
        config.areaPoints[0] = pointsopens;
        config.areaPoints[1] = pointsclicks;
        var plotLinesopen = createPlotlines(pointsopens, '#AAAAAA');
        var plotLinesclick = createPlotlines(pointsclicks, '#DDDDDD');

        var options = {
            chart : { renderTo : 'areaChart' },
            xAxis: {
                plotLines: [plotLinesopen, plotLinesclick]
            },
            series : [ data.pointsopens, data.pointsclicks ]
        };
        if (length > 100) {
            options.plotOptions = {
                area : {
                    lineWidth: 1,
                    marker : { radius : 1 }

                }
            };
        }
        options = jQuery.extend(true, {}, areaChartDefault, options);
        charts.area = new Highcharts.Chart(options);

但它仍然给了我两条深蓝色的情节线。createPlotlines 函数如下所示：

function createPlotlines(points, colour) {
    // Create plotlines from point data
    colour = typeof colour !== 'undefined' ? colour : '#CCCCCC';
    alert ('colour=='+colour);
    var plotLines = [];
    var middleYval = 0;
    for (var i in points) {
        middleYval = Math.max(middleYval, points[i].y);
        if (points[i].l) { // l property is true if label should be on for this point
            plotLines.push({
                color: colour,
                id: 'plotline'+i,
                value: points[i].x,
                width: 1,

            });
        }
    }
    return plotLines;
}
4

4 回答 4

2

如果您查看参考资料，您会发现没有 attr named colors。
另一个问题是没有 attr plotLines1，plotLines2你可以在这里看到

解决方案：如果要更改绘图线颜色，则必须通过数组传递绘图线，如下所示并设置它们的颜色：

var options = {
    chart : { renderTo : 'areaChart' },
    xAxis: {
        plotLines: [{
            color: '#4572A7', // 
            width: 2,
            value: 5.5,
            id: 'plotline-1'
        }, {
            color: '#AA4643',
            width: 2,
            value: 8.5,
            id: 'plotline-2'
        }]
    },
    series : [ data.pointsopens, data.pointsclicks ]
};

活生生的例子

Update1：您在此函数中返回一个对象数组，createPlotlines然后将此数组放入其他数组中。那就是问题所在。
将您的功能替换为以下内容：

function createPlotlines(points, colour) {
    // Create plotlines from point data
    colour = colour || '#CCCCCC';
    var middleYval = 0;
    for (var i in points) {
        middleYval = Math.max(middleYval, points[i].y);
        if (points[i].l) { // l property is true if label should be on for this point
            return {
                color: colour,
                id: 'plotline'+i,
                value: points[i].x,
                width: 1,

            };
        }
    }
}
于 2012-07-05T18:19:13.963 回答
2

您是说 xAxis 和 yAxis 的颜色不同吗？我只看到这会成为其中之一。您绝对可以独立设置轴线的颜色。看到这个：例子，参考

编辑：对于 plotLines 你可以使用这个： demo

于 2012-07-05T18:03:59.113 回答
0

您可以将 plotLines 更改为以单行为目标。

或者你可以改变整个 Yaxis 或 Xaxis

xAxis: {
            type: 'datetime',
            gridLineColor: '#EEEEEE'
        },
        yAxis: {
            title: {
                text: 'Calls'
            },
            gridLineColor: '#EEEEEE'
        }
于 2014-03-06T13:43:32.967 回答
0

好的，这是我需要的，lineColor：

 $data = array(
    "name" => $name,
    "color" => '#00FFFF',
    "lineColor"=> '#00FFFF',
    "data" => $rows
);

该代码位于我的 php.ini 中名为 compileChartData 的本地函数中。

感谢您的努力，并对混淆感到抱歉。

于 2012-07-06T17:53:47.157 回答