search

howtimeflies-io / ngx-highcharts

A Highcharts wrapper for Angular (version 4 and newer)
MIT License
0 stars 0 forks source link

The height of the chart is too narrow on Firefox #1

Closed howtimeflies-io closed 6 years ago

howtimeflies-io commented 6 years ago

height-issue-on-firefox

howtimeflies-io commented 6 years ago

From Highcharts document:

The chart's position in the HTML page is defined by the position of the container div. Height and width is set either by setting a height and width of the container div, or by setting the chart.height and chart.width Highcharts options.

To resolve the problem, we should set the chart container's height explicitely.

.chart-container {
  height: 280px;
}
@media (min-width: 576px) {
  .chart-container {
    height: 400px;
  }
}
howtimeflies-io commented 6 years ago

Another quick solution: https://github.com/gevgeny/angular2-highcharts/issues/191#issuecomment-311711325

In our case, it would be

ngx-highchart { display: block }

With this solution, the explicit chart container height styles above still apply.

howtimeflies-io commented 6 years ago

Fixed in Version 1.0.2