2015-07-24 18 views
5

Quindi sto inizializzando uno zingChart con il seguente codice.Grafico Zingchart che non riempie la larghezza del genitore

barChartData = 
     "type":"bar" 
     "series":[ 
      "values":[11,16,7,-14,11,24,-42,26,] 
     ] 


    $("#performance-bar-chart").zingchart(
     data: barChartData 
    ) 

Il grafico a barre viene reso correttamente ma la larghezza non sembra molto div. Ho controllato se qualcosa sta impostando l'altezza e la larghezza, ma nulla è.

Quando eseguo lo zoom in avanti o indietro sulla pagina (ctrl + scorrimento del mouse) il grafico si espande automaticamente per riempire il div genitore!

Grazie,

+0

si può aggiungere un violino, questo codice non aiuta davvero –

+0

http://jsfiddle.net/f29jn25b/15/ Quando riduci l'altezza della sezione dei risultati o ingrandisci la pagina, il grafico verrà automaticamente scalato per riempire la larghezza – SegFaultDev

+0

Questo risolve il tuo problema? http://jsfiddle.net/eugensunic/f29jn25b/16/, se sì allora lo metto come risposta. –

risposta

7

per risolvere il problema (improvviso cambiamento di larghezza) si dovrebbe acconciare i vostri div utilizzando

CSS:

#myChart { 
    width:100%; 
    height:300px; 
} 

e qui è il tuo JS e HTML nel caso in cui il il violino è sparito.

HTML:

<div id="myChart"></div> 

JS:

// Data for the chart 
var barChartData = { 
    type: "bar", 
    series: [{ values: [3,7,10,2,6,5]} ] 
}; 

// Make your chart 
$("#myChart").zingchart({ 
    data: barChartData 
}); 
Problemi correlati