JavaScript

Chart Size

How to define the size of your charts

All charts in Meistercharts will fill their parent container!

So in order to define the exact size of a chart, you just need to define the size of the container. This can be done in any way possible for html elements.

CSS- Classes

<!-- chart.html -->
<div id="meistercharts" class="chart-container"></div>

<!-- styles.css -->
.chart-container { width: 1024px; height: 768px; }

style- Attribute

<div id="meistercharts" style="width: 1024px; height: 768px"></div>

I can’t see the chart!

Meistercharts renders its charts in a canvas that does not have it’s own height and therefor it can happen that the container height is automatically set to 0.

So if you can’t see a chart on your page and you also don’t have any error messages in the console, try giving the container a fixed height with one of the methods described above.