usar tipos graficas grafica dinamicas con como chart javascript jquery highcharts pie-chart

javascript - tipos - Colocación de etiquetas dentro de sectores de gráfico circular(Highchart)



legend highcharts (1)

Usando Highchart. Estoy posicionando las etiquetas dentro de las rodajas utilizando la distancia y se centra bien en los dispositivos móviles, pero no en las tabletas ni en los escritorios. A medida que las dimensiones se hacen más grandes, las etiquetas se acercan demasiado a los bordes. ¿Cómo colocar etiquetas dependiendo de las dimensiones de la ventana gráfica?

plotOptions: { pie: { allowPointSelect: true, cursor: "pointer", dataLabels: { enabled: true, format: "<strong>{point.name}</strong><br>{point.percentage:.0f}%", distance: -60, color: "white" } }, series: [ { type: "pie", data: [ { name: "Not too much text here", color: "#5cb85c", y: 35 }, { name: "Not too much text here", color: "#5bc0de", y: 30 }, { name: "Less text here", color: "#78629b", y: 15 }, { name: "Less text here", color: "#f0ad4e", y: 10 }, { name: "Less text here", color: "#d9534f", y: 10 } ] } ]

EDITAR: http://jsfiddle.net/TimNguyenBSM/rL1bwam6/1/


Puede usar una variable para la opción de distance que haya preparado de antemano. Por ejemplo:

var windowSize = $(window).width(); var distance = -60; if(windowSize > 700) distance -= 30; // else if...

Y en su plotOptions.pie.dataLabels :

distance: distance