Highcharts module doesn't work properly in Firefox
See original GitHub issueHello everyone. I’m trying to show a chart with info in my angular2 application. The detail is, it’s shown properly in Chrome, but it’s cut in half in the table name section in Firefox. I can assure it’s not a CSS problem, since there is no “white empty window” overlaying the table.
This is the code I have related to it, should it come in handy.
app.module.ts
import { ChartModule } from 'angular2-highcharts';
import { HighchartsStatic } from 'angular2-highcharts/dist/HighchartsService';
import * as highcharts from 'highcharts';
export function highchartsFactory() {
const highcharts = require('highcharts');
const highChartsMore = require('highcharts/highcharts-more');
const solidGauge = require('highcharts/modules/solid-gauge');
ChartModule.forRoot(require('highcharts'),
require('highcharts/highcharts-more'),
require('highcharts/modules/solid-gauge'));
return highcharts;
}
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
TreeModule,
Ng2TableModule,
ChartModule.forRoot(require('highcharts')),
RouterModule.forRoot(appRoutes)
],
providers:[
{
provide:HighchartsStatic,
useFactory: highchartsFactory
}
],
bootstrap: [AppComponent]
})
app.component.ts
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-flowchart',
templateUrl: './flowchart.component.html',
styleUrls: ['./flowchart.component.css']
})
export class FlowchartComponent implements OnInit {
constructor() {
this.options = {
title : { text : 'simple chart' },
series: [{
data: [29.9, 1502.5, 106.4, 769, -153, 204],
}]
};
}
options: Object;
ngOnInit() {
}
}
app.component.html
<chart [options]="options"></chart>
Additional info
Even when I’m able to ng serve and take a look at it in localhost, when I deploy it via Jenkins, it throws the famous:
ERROR in Error encountered resolving symbol values statically. Calling function ‘ChartModule’, function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol AppModule in /opt/src/app/app.module.ts, resolving symbol AppModule in /opt/src/app/app.module.ts
Issue Analytics
- State:
- Created 6 years ago
- Comments:9
@maximebourdel try this css
Yes perfect solution.Thank you.