Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/423.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Highcharts实心仪表,仪表条上有刻度线_Javascript_Highcharts - Fatal编程技术网

Javascript Highcharts实心仪表,仪表条上有刻度线

Javascript Highcharts实心仪表,仪表条上有刻度线,javascript,highcharts,Javascript,Highcharts,我正在尝试使用Highchart的固体规格图来呈现如下内容: 我得到的最接近的结果是: 这看起来像: 主要问题在于黑色记号标记: 它画在吧台后面,但我希望它画在吧台上面 它不是在酒吧的中心 如何使用Highcharts实现这一点?在plotOptions和yAxis中添加zIndex 演示 完美的现在有没有办法像我的模型图像一样将刻度线居中于条形图上方?我尝试过,但没有使用tickLength:-50、或ticklosition:“外部”、确定。看来这是办不到的。是否可以使用绘制自定义记

我正在尝试使用Highchart的固体规格图来呈现如下内容:

我得到的最接近的结果是:

这看起来像:

主要问题在于黑色记号标记:

  • 它画在吧台后面,但我希望它画在吧台上面
  • 它不是在酒吧的中心

如何使用Highcharts实现这一点?

在plotOptions和yAxis中添加
zIndex

演示


完美的现在有没有办法像我的模型图像一样将刻度线居中于条形图上方?我尝试过,但没有使用
tickLength:-50、
ticklosition:“外部”、
确定。看来这是办不到的。是否可以使用绘制自定义记号?我的问题是知道从什么角度画它。。。这是图表为我们所做的很大一部分。是的,我会摆弄它,但它可能不值得。谢谢你的帮助,接受你的回答。干杯
Highcharts.chart("container", {
  chart: {
    type: 'solidgauge'
  },
  tooltip: {
    enabled: false
  },
  title: null,
  credits: {
    enabled: false
  },
  pane: {
    size: '100%',
    startAngle: -120,
    endAngle: 120,
    background: {
      innerRadius: '75%', 
      outerRadius: '100%',
      backgroundColor: '#eeeeee',
      borderWidth: 0,
      shape: 'arc'
    }
  },
  plotOptions: {
    solidgauge: {
      innerRadius: '75%',
      radius: '100%',
      dataLabels: {
        enabled: false
      }
    }
  },
  yAxis: {
    labels: {
      enabled: false
    },      
    min: 0,
    max: 100,
    gridLineColor: 'transparent',
    lineColor: 'transparent',
    minorTickLength: 0,
    tickPositions: [35],
    tickColor: '#000000',
    tickPosition: 'inside',
    tickLength: 60,
    tickWidth: 4
  },
  series: [{
    data: [40]
  }]
});
 plotOptions: {
    solidgauge: {
      innerRadius: '75%',
      radius: '100%',
      dataLabels: {
        enabled: false,
        useHTML: true,
        zIndex: 1000 //added
      }
    }
  },
  yAxis: {
    labels: {
      enabled: false
    },      
    min: 0,
    max: 100,
    gridLineColor: 'transparent',
    lineColor: 'transparent',
    minorTickLength: 0,
    tickPositions: [35],
    tickColor: '#000000',
    tickPosition: 'inside',
    tickLength: 50,
    tickWidth: 8,
    zIndex: 100, //added
  },