Rendering errato dell'asse y nelle carte polari

Question

Ho bisogno di aiuto con l'asse y delle carte polari come ragnatela o rosa dei venti. Ho un'applicazione con una dashboard che contiene alcuni widget, ciascuno contenente un iframe con un grafico Highcharts. Poiché questi widget sono riusabili, ho qualche javascript per ridimensionare il contenitore dei grafici.

$(window).bind("resize", resizeChart); 
    function resizeChart() { 
     var width = $(document).width() - 55; 
     var height = $(document).height() - 60; 
     $("#container").css("width", width); 
     $("#container").css("height", height); 
    } 

Qualche esempio: http://jsfiddle.net/CwnDw/

Il mio problema è, che la scala del y spesso sembra molto brutto. Quando il grafico viene caricato, l'asse y ha solo un segno di spunta. Dopo aver ridimensionato il grafico a + 10 px, non contiene alcun segno di spunta e dopo il ridimensionamento delle dimensioni iniziali, l'asse y viene visualizzato con 5 segni di graduazione. Non capisco perché. Nel mio esempio ottengo solo questi effetti quando ridimensiono il grafico da una dimensione piccola a una dimensione più grande molto velocemente.

C'è un modo migliore per ridimensionare un grafico? Ho provato la funzione chart.setSize() su, ma nessun effetto. Oppure: esiste un modo per rieseguire/ricalcolare l'asse y?

Grazie Torben

Answer 1

Prova questo:

function resizeChart() { 
    var width = $(document).width() - 55; 
    var height = $(document).height() - 60; 
    $("#container").css("width", width); 
    $("#container").css("height", height); 
    setTimeout(function() { 
     chart1.setSize(
      width, 
      height, 
      false 
     ); 
    },10); 
} 

http://jsfiddle.net/9YFB8/2/

Answer 2

io non sono sicuro di un metodo di ridisegno che avrebbe compiere ciò che si sta cercando, ma con la mia esperienza di utilizzo Highcharts, ho trovato che è meglio specificare le posizioni di spunta per evitare risultati imprevisti.

Ecco un link alla documentazione Highchart quanto riguarda yAxis: tickPosition

http://api.highcharts.com/highcharts#yAxis.tickPositions

V'è un buon esempio jsFiddle lì che dovrebbe coprire implementazione.