Question

在this Highcharts Scatter 3d example上，它应用径向渐变，以便在使用3d时标记更好。就我而言，我也想使用colorByPoint: true，但我不想将径向渐变应用于所有图表（就像那个例子那样）。在我的情况下，我有报告可能会显示几个不同的图表（有些将使用`colorByPoint1），我不想在所有图表中使用径向渐变。然而，我想要默认的Highcharts颜色。

我如何调整上面的示例，以便径向渐变仅应用于图表的一个实例？

提前多多感谢，

Answer 1

设置演示的方式，顶部的代码块设置Highcharts的颜色，这些颜色将应用于所有未明确指定颜色集的图表：

Highcharts.getOptions().colors = $.map(Highcharts.getOptions().colors, function (color) {...}

您可以做的是设置一个变量来保存径向颜色：

    // Give the points a 3D feel by adding a radial gradient
    var radColors = $.map(Highcharts.getOptions().colors, function(color) {
        return {
            radialGradient: {
                cx: 0.4,
                cy: 0.3,
                r: 0.5
            },
            stops: [
                [0, color],
                [1, Highcharts.Color(color).brighten(-0.2).get('rgb')]
            ]
        };
    });

然后将该变量指定为您要将其用于的图表的colors属性：

var chart = new Highcharts.Chart({
  colors: radColors,
  chart: { ... }
  ...
});

使用多个图表更新了小提琴：

http://jsfiddle.net/jlbriggs/ubeh1wbo/

您可以创建任意数量的颜色集变量，并根据需要将它们提供给不同的图表类型。

如何为3d应用径向渐变，但仅适用于特定图表？

1 个答案: