Plotly gauge：改變量規段的順序

請參閱小提琴。我試圖'翻轉'這個量表，以便第一部分是80％，第二部分是20％（第一部分，我的意思是9點開始）。然而，無論按什麼順序將值放入values數組中，plotly總是首先對值排序並首先繪製最小的段。（注意：'50'值在儀表下半部分畫出一個看不見的180度白色部分，這就是Plotly的例子的工作原理。）Plotly gauge：改變量規段的順序

任何人都可以協助這個嗎？謝謝！

values: [40, 10, 50] // re-arranging the 40 and 10 makes no difference in how the wedges are plotted

https://jsfiddle.net/0L6kv7L0/1/

來源

2016-11-29 David

我想我找到了API，這是增加一個「排序：假」在一個可能的解決方案。 – David

Plotly的計圖表只是變形餅圖。

您需要指定方向才能執行正確的方向。

direction: "clockwise"

請參閱here更新您的小提琴和下面的兩個例子。

var data = [{ 
 
    values: [40, 10, 50], 
 
    marker: { 
 
    colors: ['rgba(255, 0, 0, .5)', 'rgba(110, 154, 22, .5)', 
 
     'rgba(255, 255, 255, 0)' 
 
    ] 
 
    }, 
 
    text: ['80%', '20%', "I'm just a white piece of pie"], 
 
    textinfo: 'text', 
 
    textposition: 'inside', 
 
    type: 'pie', 
 
    rotation: 90, 
 
    direction: "clockwise" 
 
}]; 
 

 

 
Plotly.newPlot('myDiv1', data); 
 

 
data = [{ 
 
    values: [10, 40, 50], 
 
    marker: { 
 
    colors: ['rgba(255, 0, 0, .5)', 'rgba(110, 154, 22, .5)', 
 
     'rgba(255, 255, 255, 0)' 
 
    ] 
 
    }, 
 
    text: ['20%', '80%', "I'm just a white piece of pie"], 
 
    textinfo: 'text', 
 
    textposition: 'inside', 
 
    type: 'pie', 
 
    rotation: 90, 
 
    direction: "counterclockwise" 
 
}]; 
 

 
Plotly.newPlot('myDiv2', data);

<script src="https://cdn.plot.ly/plotly-latest.min.js"></script> 
 
<div id="myDiv1" style="width: 480px; height: 400px;"> 
 
</div> 
 
<div id="myDiv2" style="width: 480px; height: 400px;"> 
 
</div>

來源

2016-11-29 20:31:04

真棒，非常感謝，我會嘗試你的代碼。 – David

Plotly gauge：改變量規段的順序

回答

相關問題