Angularjs highchart doesn't show in IE and SAF

2019-08-20 06:04发布

highchart doesn't show in IE and SAFARI. I try the solution from the official highchart forum, but nothing help (remove "," at the end of json, or resize page on load etc... ) I have multiple different highcharts, but here is only one for explanation. I call config function depends on chart data. My app have many different parts, and it's very hard to make working plunker. Thnx

Here is my code

function getBaseChartConfig(graphName) {
            Highcharts.setOptions({
                global: {
                    useUTC: false
                }
            });
            var config =
                    {
                        xAxis: {
                            ordinal: false
                        },
                        yAxis: {
                        },
                        options: {
                            chart: {
                                zoomType: 'x',
                                backgroundColor: 'rgba(255, 255, 255, 1)',
                                polar: true,
                                type: 'line',
                                borderRadius: 5

                            },
                            legend: {
                                enabled: true
                            },
                            rangeSelector: {
                                //za postavit rucni upis date range-a
                                enabled: false,
                                inputStyle: {
                                    color: 'black'
                                }
                            },
                            navigator: {
                                enabled: true
                            }
                        },
                        series: [],
                        title: {
                            text: graphName
                        },
                        useHighStocks: true
                    };
            return config;
        };
$scope.data.push(solar_voltage);
            $scope.data.push(battery_voltage);
            $scope.data.push(solar_current);
            $scope.data.push(hybridCurrent);
            $scope.chartConfig1 = getChartConfigWithYaxisPlotLines('Production');
            $scope.chartConfig1.series.push({
                id: 1,
                name: "Solar voltage",
                data: $scope.data[0],
                tooltip: {
                    valueDecimals: 2
                }
            }, {
                id: 2,
                name: "Battery voltage",
                data: $scope.data[1],
                tooltip: {
                    valueDecimals: 2
                }
            }, {
                id: 3,
                name: "Solar current",
                data: $scope.data[2],
                tooltip: {
                    valueDecimals: 2
                }
            }, {
                id: 4,
                name: "Hybrid current",
                data: $scope.data[3],
                tooltip: {
                    valueDecimals: 2
                }
            }
            );
 function getChartConfigWithYaxisPlotLines(graphName) {
            var baseChartConfig = getBaseChartConfig(graphName);
            baseChartConfig.yAxis.plotLines = [{
                    color: '#FF0000',
                    width: 1,
                    value: 11.50,
                    label: {text: '11.50'}
                }];
            return baseChartConfig;
        }

Here is image how this look in safari or IE enter image description here

And here is in CHROME and FIREFOX enter image description here

This is my json from api enter image description here

0条回答
登录 后发表回答