highcharts 是否可以将dashstyle设置为solidgauge highchart？

yr9zkbsy 于 5个月前发布在 Highcharts

关注(0)|答案(1)|浏览(55)

我想使边界虚线，但解决方案饼图不工作。
由于某些原因，图形属性是未定义的solidgauge图表。可能是虚线风格可以设置窗格。背景属性不知何故。

Highcharts.chart('container', {
  chart: {
    type: 'solidgauge',
    events: {
      load: function() {
        this.series[0].graph.attr({
          dashstyle: "LongDash"
        });
      },
    },
  },

  pane: {
    startAngle: -90,
    endAngle: 90,
    background: [{
      outerRadius: '90%',
      innerRadius: '60%',
      backgroundColor: "white",
      borderWidth: 1,
      shape: "arc",
    }]
  },

  yAxis: {
    min: 0,
    max: 100,
    lineWidth: 0,
    tickPositions: []
  },

  plotOptions: {
    solidgauge: {
      dataLabels: {
        enabled: false
      },
      stickyTracking: false,
    }
  },

  series: [{
    data: [{
      radius: '90%',
      innerRadius: '60%',
      y: 0
    }],
  }]
});

个字符

highcharts

来源：https://stackoverflow.com/questions/77599300/is-it-possible-to-set-dashstyle-to-solidgauge-highchart

1条答案

按热度按时间

yyhrrdl81#

在这种情况下，你可以抓取pane元素并添加stroke-dasharray属性：

Highcharts.chart('container', {
  chart: {
    type: 'solidgauge',
    events: {
      load: function() {
        this.pane[0].group.attr({
         "stroke-dasharray": "15"
        });
      },
    },
  },
  pane: {
    startAngle: -90,
    endAngle: 90,
    background: [{
      outerRadius: '90%',
      innerRadius: '60%',
      backgroundColor: "white",
      borderWidth: 1,
      shape: "arc",
    }]
  },
  yAxis: {
    min: 0,
    max: 100,
    lineWidth: 0,
    tickPositions: []
  },
  plotOptions: {
    solidgauge: {
      dataLabels: {
        enabled: false
      },
      stickyTracking: false,
    }
  },
  series: [{
    data: [{
      radius: '90%',
      innerRadius: '60%',
      y: 0
    }],
  }]
});

个字符

Demo：https://jsfiddle.net/BlackLabel/s52fguka/

赞(0）回复(0）举报 5个月前