Javascript 如何使用high chart创建半圆量规？

我必须使用high chart创建一个半圆形仪表图。我有，但这一个有一个完整的圆形表盘。所需的是一个半圆形刻度盘，即只包含刻度盘的上部。

像这样更改最后一个功能，您将拥有完整刻度盘的上部

 // 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);

    });

//添加一些生命
功能（图表）{
setInterval（函数（）{
变量点=图表。系列[0]。点[0]，
纽瓦尔公司=100；
纽瓦尔公司；
如果（newVal<0 | | newVal>100）{
newVal=50；
}
更新点（newVal）；
}, 3000);
});

像这样更改最后一个功能，您将拥有完整刻度盘的上部

 // 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);

    });

//添加一些生命
功能（图表）{
setInterval（函数（）{
变量点=图表。系列[0]。点[0]，
纽瓦尔公司=100；
纽瓦尔公司；
如果（newVal<0 | | newVal>100）{
newVal=50；
}
更新点（newVal）；
}, 3000);
});

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

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

查看修改后的演示

---

请参阅高端图表上的API，您可以将中心参数添加到窗格部分

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

查看修改后的演示

---

请参阅高图中的API，您可以将背景形状设置为圆弧，例如

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

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

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

---

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

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

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

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

应该这样做

---

这应该就够了。

我认为这不是他想要的。这只是将针移动到“100”点。仪表仍然是一个“全圆”，实际绘图区域为半圆，底部为黑色空间。检查此绘图带：[{from:0，to:100，innerRadius:'40%'，outerRadius:'65%'，颜色：{linearGradient:{x1:0，y1:0，x2:1，y2:1}，停止：[[0'，#fff']，[1'，#fff']]}//green}，{from:0，to:100，内半径：“45%”，外半径：“60%”，颜色：“#000'//red}]将

更改为：100

。你想要这个？我不认为这是他想要的。这只是将针移动到“100”点。仪表仍然是一个“全圆”，实际绘图区域为半圆，底部为黑色空间。检查此绘图带：[{from:0，to:100，innerRadius:'40%'，outerRadius:'65%'，颜色：{linearGradient:{x1:0，y1:0，x2:1，y2:1}，停止：[[0'，#fff']，[1'，#fff']]}//green}，{from:0，to:100，内半径：“45%”，外半径：“60%”，颜色：“#000'//red}]将

更改为：100

。你要这个吗？