Question

我必须使用高图创建一个半圆形的仪表图表。我有this one，但这个有一个完整的圆形表盘。所需要的是半圆形表盘，即仅包含表盘的上部。

Answer 1

您可以将中心参数添加到窗格部分

pane : {
  center: ['50%', '100%']
   ...
}

请参阅修改后的演示http://jsfiddle.net/EjRLw/524/

请参阅高级图表http://api.highcharts.com/highcharts#pane.center

中的API

Answer 2

更改最后一个功能，您将拥有完整拨号的上半部分

 // Add some life
    function(chart) {
        setInterval(function() {
            var point = chart.series[0].points[0],
                newVal, inc = 100;

            newVal = inc;
            if (newVal < 0 || newVal > 100) {
                newVal = 50;
            }

            point.update(newVal);

        }, 3000);

    });

Answer 3

您可以将背景形状设置为弧形，例如

pane:{
      background:{
        ...
        shape:'arc'
        ...
      }
    }

然后使用此CSS删除半圆下方的空间

.chatcontainer > div {
   margin-bottom: -35% !important
}
.chatcontainer > div.highcharts-container > svg {
   margin-bottom: -35%; max-height: 65% !important;
}

Answer 4

    pane: {
        startAngle: -90,
        endAngle: 90,
        background:[]
    },

That should do it.

如何使用高图创建半圆规？

4 个答案: