Code: Select all
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { AppService } from '../../../services/app.service';
import * as Highcharts from 'highcharts';
import HighchartsExporting from "highcharts/modules/exporting";
import HighchartsExportData from "highcharts/modules/export-data";
import SeriesLabel from "highcharts/modules/series-label";
import { ToastrService } from 'ngx-toastr';
import { ChartUtil } from '../../../helpers/chart.util'
import { ChartScopeConfig } from 'src/app/models/app.model';
import { BreadcrumbData } from 'src/app/models/app.model';
HighchartsExporting(Highcharts);
HighchartsExportData(Highcharts);
SeriesLabel(Highcharts);
@Component({
selector: 'prodcount',
templateUrl: './prodcount.component.html',
providers: [ChartUtil]
})
export class ProdCountComponent implements OnInit {
highcharts: typeof Highcharts = Highcharts;
dataAvailable = 0;
productionCountChartOptions: Highcharts.Options = {
chart: {
zoomType: 'xy',
reflow: true
},
accessibility:{
enabled: true,
highContrastTheme: true,
keyboardNavigation:{
enabled: true,
seriesNavigation: {
mode: "normal",
pointNavigationEnabledThreshold: false,
skipNullPoints: true,
},
},
},
title: {
Code: Select all
this.productionCountChartOptions.series = [{
name: 'Units',
type: 'column',
yAxis: 1,
data: this.chartData.units,
tooltip: {
valueSuffix: ' Units'
}}, {
name: 'Rolling Avg Built',
type: 'spline',
label: {
enabled: true
},
yAxis: 1,
data: this.chartData.avgBuilt,
marker: {
enabled: true
With what I've shown here are you able to help me figure out how to call .reflow() or find a way to reflow. I know it's possible by finding the size of the div container the chart is in but I'm trying to keep it clean and not reference any html id's or elements.