如何使用高圖創建半圓形測量儀？

我必須使用高圖創建半圓形量表。我有this one，但這個有一個完整的圓形錶盤。所需要的是半圓形錶盤，即只包含錶盤的上部。如何使用高圖創建半圓形測量儀？

2012-08-27 Parth

改變這樣的最後一個函數，你將有充分的撥號

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

    });

來源

2012-08-27 13:27:05

我不認爲這是他所要求的。這只是將針頭移動到「100」點。儀表仍然是一個「完整的圓」，實際圖表區域爲半圓，底部爲黑色空間。 – wergeld

是Wergeld。你是對的。我需要一個半圓形的量表。 – Parth

檢查此plotBands：[{ 從：0，到：100， innerRadius：'40％ ' outerRadius：'65％'，顏色：{的LinearGradient：{X1：0，Y1：0，X2： 1，Y2：1}，停：[ [0， '#FFF']， [1， '#FFF'] ]} //綠色 }，{ 從：0，到：100， innerRadius：'45％'， outerRadius：'60％'， color：'＃000'//紅色 }] 一個更改爲'100：'。這是你想要的嗎？ –

您可以添加中心參數車窗玻璃部分的上部，

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

看到修改後的演示，http://jsfiddle.net/EjRLw/524/

參考高圖上的API http://api.highcharts.com/highcharts#pane.center

來源

2013-02-12 21:42:32

您可以將背景形狀設置爲例如圓弧

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

然後用這個CSS刪除半圓

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

來源

2016-04-07 15:19:38 njmwas

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

應該這樣做下面的空間。

來源

2016-04-15 11:00:19

如何使用高圖創建半圓形測量儀？

回答

相關問題