amchart не работает идеально с браузером Safari в Angular5 - PullRequest
0 голосов
/ 28 августа 2018

Я пытаюсь создать анимированный калибровочный график с помощью amchart в angular5.

app.component.ts

ngAfterViewInit() {
    this.chart = this.AmCharts.makeChart("chartdiv", {
      "theme": "light",
      "type": "gauge",
      "axes": [{
        "topTextFontSize": 20,
        "topTextYOffset": 70,
        "axisColor": "#31d6ea",
        "axisThickness": 1,
        "endValue": 100,
        "gridInside": true,
        "inside": true,
        "radius": "50%",
        "valueInterval": 10,
        "tickColor": "#67b7dc",
        "startAngle": -90,
        "endAngle": 90,
        "unit": "%",
        "bandOutlineAlpha": 0,
        "bands": [{
          "color": "#0080ff",
          "endValue": 100,
          "innerRadius": "105%",
          "radius": "170%",
          "gradientRatio": [0.5, 0, -0.5],
          "startValue": 0
        }, {
          "color": "#3cd3a3",
          "endValue": 0,
          "innerRadius": "105%",
          "radius": "170%",
          "gradientRatio": [0.5, 0, -0.5],
          "startValue": 0
        }]
      }],
      "arrows": [{
        "alpha": 1,
        "innerRadius": "35%",
        "nailRadius": 0,
        "radius": "170%"
      }]
    });

    setTimeout(() => {
      setInterval(() => {
        var value = Math.round(Math.random() * 100);
        this.chart.arrows[0].setValue(value);
        this.chart.axes[0].setTopText(value + " %");
        // adjust darker band to new value
        this.chart.axes[0].bands[1].setEndValue(value);
      },2000)
    },2000)
  }

  ngOnDestroy() {
    if (this.chart) {
      this.AmCharts.destroyChart(this.chart);
    }
  }

app.component.html

<div id="chartdiv" [style.width.%]="100" [style.height.px]="500"></div>

В приведенном выше коде я создал простой анимированный граф калибровки, я также добавил свойство диаграмм к графику калибровки. Проблема заключается в том, что при добавлении параметров запроса к текущему URL цвет полос автоматически меняется на черный. Я нашел эта проблема только в браузере Safari, а не в Chrome или Firefox. Может кто-нибудь помочь мне решить эту проблему?

...