dynamic height of chart of highchart

问题

It is necessary to automaticly and dynamicly change (update) the height of highcharts's charts depending on the amount rows (example, for horizontal bars) on it.

The height of one element (example, horizontal bar) is constant (for example, 20px). The height of charts with X elements set automaticly (~ 20px * X).

回答1:

You can do this with a little pre-setup.

• Set variables for:
  • the top and bottom margins
  • the point and group padding
  • the width of the points
  • the number of data points in your data set

Calculate and set the chart's height property accordingly:

var barCount = chartData.length,
    pointWidth = 20,
    marginTop = 70,
    marginRight = 10,
    marginBottom = 50,
    marginLeft = 100,
    groupPadding = 0,
    pointPadding = 0.3,
    chartHeight = marginTop 
                + marginBottom 
                + ((pointWidth * barCount) * (1 + groupPadding + pointPadding));

Fiddle:

• http://jsfiddle.net/jlbriggs/kpu5d1qf/

(update the dataPoints variable on the page to see it in action)

来源：https://stackoverflow.com/questions/39894055/dynamic-height-of-chart-of-highchart