CODEWITHSUNDEEP
javascripthtmlecharts
Silver Ringvee
Silver Ringvee

Reputation: 5545

ECharts automatic height

Is it possible to create ECharts line chart without specifying it's container height - make it responsive to the actual data.

The number of items in Y axis can vary.

By default, when I don't define the height of the container, it will be 0 and the chart is not visible.

In this example there are 6 items (months) in Y axis, but what if I wanted to show 12 months in the same container, without making the bars 50% narrower? enter image description here

Upvotes: 5

Views: 17262

Answers (1)

Silver Ringvee
Silver Ringvee

Reputation: 5545

If you know how many rows or bars you are going to have, you can use it to calculate the height of the container.

For example, if each row is 31px and fixed height of graph header & footer is 200px you could use:

var chartHeight = dataValues.length * 31 + 200;
$('#graph-container').css({'height': chartHeight});

Upvotes: 3

Related Questions