高图：实心阴影

Question

In the Highcharts API, they have have 'shadow' listed as a property for solidgauge plotOptions as well as for solidgauge series , but in neither case does it appear to make any difference. Working in my own project and on the Highcharts jsfiddle demo it just doesn't seem to do anything if I set it to true or assign an object with specific properties. Am I doing something wrong or is this just the way it is?

Answer 1

It seems to be a bug - I reported it here: https://github.com/highcharts/highcharts/issues/7512

As a workaround you can apply SVG defs pattern like in this live demo : http://jsfiddle.net/kkulig/ckLmz931/

JS:

  defs: {
    glow: {
      tagName: 'filter',
      id: 'shadow',
      opacity: 1,
      children: [{
        tagName: 'feGaussianBlur',
        result: 'coloredBlur',
        stdDeviation: 5
      }, {
        tagName: 'feMerge',
        children: [{
          tagName: 'feMergeNode',
          in : 'coloredBlur'
        }, {
          tagName: 'feMergeNode',
          in : 'SourceGraphic'
        }]
      }]
    }
  }

CSS

@import 'https://code.highcharts.com/css/highcharts.css';

.highcharts-point {
    filter: url(#shadow);
}

---

Docs demo about defs : https://www.highcharts.com/docs/chart-design-and-style/gradients-shadows-and-patterns