Highchart - 如何半圆饼图

Question

半圆馅饼三角计

如何在顶部创建上述半圆饼图用三角形计内创建附加的图像计图表。

我有车速表测量工作，但它不符合需要。

是否有一种方法在高图表中使用三角形而不是车速表？

谢谢

Answer 1

这里是与调整JSON的小提琴。

https://jsfiddle.net/mschreiberjdi/nwb7vL62/

$(function() { 
    $('#container').highcharts({ 
    chart: { 
     renderTo: 'container', 
     plotBackgroundColor: null, 
     plotBackgroundImage: null, 
     plotBorderWidth: 0, 
     plotShadow: false 
    }, 
    title: { 
     text: '40%<br>Probability Of <br>Success', 
     align: 'center', 
     verticalAlign: 'bottom', 
     y: -145 
    }, 
    tooltip: { 
     pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>' 
    }, 
    pane: { 
     center: ['50%', '75%'], 
     size: '50%', 
     startAngle: -90, 
     endAngle: 90, 
     background: { 
     borderWidth: 0, 
     backgroundColor: 'none', 
     innerRadius: '60%', 
     outerRadius: '100%', 
     shape: 'arc' 
     } 
    }, 
    yAxis: [{ 
     lineWidth: 0, 
     min: 0, 
     max: 90, 
     minorTickLength: 0, 
     tickLength: 0, 
     tickWidth: 0, 
     labels: { 
     enabled: false 
     }, 
     title: { 
     text: '', //'<div class="gaugeFooter">46% Rate</div>', 
     useHTML: true, 
     y: 80 
     }, 
     /*plotBands: [{ 
     from: 0, 
     to: 46, 
     color: 'pink', 
     innerRadius: '100%', 
     outerRadius: '0%' 
     },{ 
     from: 46, 
     to: 90, 
     color: 'tan', 
     innerRadius: '100%', 
     outerRadius: '0%' 
     }],*/ 
     pane: 0, 

    }], 
    plotOptions: { 
     pie: { 
     dataLabels: { 
      enabled: true, 
      distance: -50, 
      style: { 
      fontWeight: 'bold', 
      color: 'white', 
      textShadow: '0px 1px 2px black' 
      } 
     }, 
     startAngle: -90, 
     endAngle: 90, 
     center: ['50%', '75%'] 
     }, 
     gauge: { 
     dataLabels: { 
      enabled: false 
     }, 
     pivot: { 
      radius: 80, 
      borderWidth: 2, 
      borderColor: 'transparent', 
      backgroundColor: 'white' 
     }, 
     dial: { 
      radius: '100%', 
      backgroundColor: 'gray', 
      borderColor: 'gray', 
      baseWidth: 140, 
      topWidth: 1, 
      baseLength: '10%', // of radius 
      rearLength: '10%' 
     } 
     } 
    }, 

    series: [{ 
     type: 'pie', 
     name: 'Browser share', 
     innerSize: '50%', 
     data: [ 
     ['Low', 25], 
     ['Medium', 25], 
     ['HIgh', 25] 
     ] 
    }, { 
     type: 'gauge', 
     data: [40], 
     dial: { 
     rearLength: 0 
     } 
    }], 
    }); 
});