Zingchart chart does not fill parent width of div

Question

So, I initialize zingChart with the following code.

barChartData = "type":"bar" "series":[ "values":[11,16,7,-14,11,24,-42,26,] ] $("#performance-bar-chart").zingchart( data: barChartData ) 

Barchart is rendered correctly, but the width does not seem to be much larger than the parent div. I checked if something sets the height and width, but there is nothing.

When I zoom in or out of the page (ctrl + mouse scroll), the chart automatically expands to fill the parent div!

Thanks,

Answer 1

To solve your problem (sudden change in width), you should style your div using

CSS

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

and here is your JS and HTML if the script is gone.

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 });