Angular状态在切换回该状态后未显示amcharts

时间:2016-07-13 09:48:33

标签: angularjs amcharts

我在html中有两个图表div,我可以第一次显示。但是当我的状态发生变化时,我又回到了显示图表的状态。然后没有显示图表。我想我必须重新附加dataProvider并再次渲染它,但我不知道如何。 这是我的控制器

.controller('HomeCtrl', function ($location,$window) {
  AmCharts.makeChart("chartdiv-pie", {
      "type": "pie",
      "theme": "light",
      "dataProvider": [{
          "title": "20%",
          "value": 3852,
          "color": "#18aa9f"
      }, {
          "title": "40%",
          "value": 3899,
          "color": "#e65548"
      },
      {
          "title": "40%",
          "value": 4899,
          "color": "#e1e3e4"
      }

      ],
      "title": "AmCharts",
      "color": "black",
      "titleField": "title",
      "valueField": "value",
      "radius": "25%",
      "outlineAlpha":0,
      "innerRadius": "40%",
      "balloonText": "[[value]]",
      "labelText": "[[title]]",
      "labelsEnabled": true,
      "colorField": "color",
       "labelText": "[[title]]",
      "export": {
        "enabled": true
      },

    });  

    var chart = AmCharts.makeChart( "chartdiv-male", {
      "type": "serial",
      "addClassNames": true,
      "theme": "light",
      "autoMargins": false,
      "marginLeft": 30,
      "marginRight": 8,
      "marginTop": 10,
      "marginBottom": 26,
      "balloon": {
        "adjustBorderColor": false,
        "horizontalPadding": 10,
        "verticalPadding": 8,
        "color": "#ffffff"
      },

      "dataProvider": [ {
        "year": "Pos",
        "income": 30.1,
        "color": "#FF0F00",
        "expenses": 34.9,

      }, {
        "year": "Neg",
        "income": 29.5,
        "expenses": 31.1
      }, {
        "year": "Neu",
        "income": 30.6,
        "expenses": 28.2,
        "dashLengthLine": 5,
        "columnColor": 'green'
      } ],
      "valueAxes": [ {
        "axisAlpha": 0,
        "position": "left"
      } ],
      "startDuration": 1,
      "graphs": [ {
        "alphaField": "alpha",
        "balloonText": "<span style='font-size:12px;'>[[title]] in [[category]]:<br><span style='font-size:20px;'>[[value]]</span> [[additional]]</span>",
        "fillAlphas": 1,
        "title": "Income",
        "type": "column",
        "valueField": "income",
        "dashLengthField": "dashLengthColumn"
      }, ],
      "categoryField": "year",
      "categoryAxis": {
        "gridPosition": "start",
        "axisAlpha": 0,
        "tickLength": 0
      },
      "export": {
        "enabled": true
      }
    } );

}

这些是我的州

.state('home.stats', {
        url:'/stats',
        templateUrl: 'views/stats.html',
        controller: 'StatsCtrl',
        controllerAs: 'stats'
      })
      .state('home.posts', {
        url:'/posts',
        templateUrl: 'views/posts.html',
        controller: 'PostsCtrl',
        controllerAs: 'posts'
      });

0 个答案:

没有答案