guideline - highcharts vertical bar

Personalización de la carta de donuts Highcharts

Question

Tengo una licencia para Highcharts y me gustaría crear un char como el siguiente:

El componente más similar en Highcharts es el siguiente:

¿Alguien sabe que es posible reemplazar el pastel dentro por solo un porcentaje? o alguna otra buena librería de JavaScript del lado del cliente para hacerlo?

Puede encontrar una demostración y la API en los siguientes enlaces.

DEMO http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/pie-donut/

API http://api.highcharts.com/highcharts#chart

Gracias

Answer 1

Consulte sobre innerSize .

"The size of the inner diameter for the pie. A size greater than 0 renders a donut chart. Can be a percentage or pixel value. Percentages are relative to the size of the plot area. Pixel values are given as integers. Defaults to 0." referencia

Entonces puedes echar un vistazo a este ejemplo que muestra cómo poner el text dentro del gráfico de dona.

Espero que te ayude

Answer 2

 function(chart4) {
chart4.renderer.text(''<span style="word-wrap: break-word !important;">Reduced by <br/>10 Years</span>'', (chart4.chartWidth/2)-38, (chart4.chartHeight/2)-5)
.css({
color: ''#4b4b4b'',
fontWeight: ''bold'',
fontSize: ''12px''
})
.add();
}

Answer 3

Puede intentar usar el título como una alternativa y un enfoque bastante simple.

 title: {
text: ''Budget'',
align: ''center'',
verticalAlign: ''middle'',
style: {
fontSize: ''9.5px''
}
},

JsFiddle: http://jsfiddle.net/amigoo/zwod86e1/