Question

如图所示，我想逐点更改填充颜色（在我的情况下参考项目状态）， visual for my chart

到目前为止我用过的代码实现了这个，

    $(function () {
    $('#ao-projectssummry-chart').highcharts({
        type: "spline",
        title: null,
        borderRadius : null,
        xAxis: {
            categories: ['May2016', 'June2016', 'July2016', 'August2016', 'september2016', 'November2016'],
            opposite: true
            //type: 'datetime',
            //min: Date.UTC(2011, 4, 31),
            //max: Date.UTC(2012, 11, 6)
        },
        yAxis: {
            min: 0,
            max: 5,
            title : null
        },
        plotOptions: {
            series: {
                lineWidth: 20,
                borderRadius: null,
                radius: 0
            },
            marker: {
                radius : 0
            }

        },
        credits : {
            enabled : false
        },
        legend: {
            enabled : false
        },

        series: [{
            name: "Project 1",
            data: [1, 1, {
                y: 1,
                            marker: {
                                symbol: 'url(https://www.highcharts.com/samples/graphics/sun.png)',
                                overlapping: true
                            }
                }, {
                    y: 1,
                            marker: {
                                symbol: 'url(https://www.highcharts.com/samples/graphics/sun.png)'
                            }
                }, {
                    y: 1,
                    marker: {
                        symbol: 'url(https://www.highcharts.com/samples/graphics/sun.png)'
                    }
                }
                ]
        },
        {
            name: "Project 2",

            data: [2, {
                y: 2,
                marker: {
                    symbol: 'url(https://www.highcharts.com/samples/graphics/sun.png)',
                    overlapping : true
                }
            }, 2, 2, 2, {
                y:2,
                marker: {
                    symbol: 'url(https://www.highcharts.com/samples/graphics/sun.png)',
                    overlapping: true
                }
            },
            ]
        }]
    });
});

那么，我该如何逐点改变plotoption？我怎样才能实现图片中显示的背景线？

任何帮助将不胜感激！提前谢谢。

Answer 1

您需要直接在// allocate new strings char * key = (char *) malloc(key_len + 1); char * value = (char *) malloc(value_len + 1); // copy string content and ensure that string is null-terminated memcpy(key, key_ptr, key_len); key[key_len] = 0; memcpy(value, value_ptr, value_len); value[value_len] = 0; // print printf("%s %s\n", key, value); // free free(key); free(value);数组中指定：

示例代码：

data

您可以在plotOptions中指定影响数据点的任何内容，您可以通过这种方式为特定数据点指定。

您未指定任何内容的任何点，都遵循默认选项或plotOptions中指定的选项。

<强>小提琴：

http://jsfiddle.net/jlbriggs/3d3fuhbb/126/

<强>输出：

Answer 2

好的，所以似乎问题与我第一次看到的不同。您需要更改标记之间的线段颜色，而不是更改点标记的颜色。

这是一种使用Array ( [1] => 1-256 [0] => 257-1024 [2] => 1025-2056 )系列类型而不是行来实现您所要求的方法。这样可以提供更大的灵活性和控制力。

想法：

首先，设置类型，并反转图表（列范围是垂直系列类型;要使其水平，反转图表 - x轴现在是垂直轴，y轴现在是水平轴）：

columnrange

相应地更新轴设置（将x替换为y）。

使用chart: { type: "columnrange", inverted: true }值，x值（起点）和low值（终点）设置数据。

将颜色设置为您想要的颜色：

high

要放置标记，请添加一个单独的系列，行或分散（我使用行，data: [{ x: 1, low: Date.UTC(2016,3,15), high: Date.UTC(2016,4,21), color: 'rgb(0,156,255)' },{ x: 3, low: Date.UTC(2016,2,7), high: Date.UTC(2016,6,15), color: "rgb(204,0,0)" }]，因为散布系列使用不同的工具提示模型，并且不容易与其他系列集成，如果工具提示对你很重要，但除此之外，两者都是一样的。）

标记系列：

lineWidth: 0

示例：

https://jsfiddle.net/jlbriggs/x7c3t81n/

<强>输出：

在高级图表中更改图形系列Fillcolor

2 个答案: