如何在没有按钮的情况下在Highcharts动态添加系列？ （ANGULAR JS）

Question

我的问题很具体。如何通过Angular JS在没有按钮的情况下在highcharts中动态添加系列，否则，无需单击功能。

这是我的控制者：

  var deserialize = angular.fromJson(data.dataContent); //Específico para el dataContent

    for(var i =0; i < deserialize.length; i++){

      var url = deserialize[i];

      $http.get(url).success(function(data){

        var n_scope = [];//NOMBRES PARA LA SERIE
        var e_scope = []; //EMPLEADOS

        for (var i = 0; i < data.length; i++) {

          var nombre_scope = n_scope.push(data[i].nombre);
          var empleados_scope = e_scope.push(parseInt(data[i].empleados));

        }

        var chart = {};

        chart.addSeries({
          name: n_scope[i],
          data: e_scope[i]
        });

这是图表：

  $scope.renderChart = {
              chart: {
                  type: typeArray[2]
              },
              title: {
                   text: titleArray[2]
                   },
              xAxis:{
                categories: yAxisTiArray[2],
                title: {
                  enabled: false
                },
                labels: {
                  enabled: false
                }
              },
              yAxis:{
                title: {
                  text: yAxisTiArray[2]
                }
              },
              series: chart,
              legend: {
                  enabled: true
              },
              credits: {
                enabled: false
             },
             lang: {
               printChart: 'Imprimir gráfico',
               downloadPNG: 'Descargar en PNG',
               downloadJPEG: 'Descargar en JPG',
               downloadPDF: 'Descargar en PDF',
               downloadSVG: 'Descargar en SVG',
               contextButtonTitle: 'EXPORTAR'
             }
           };

我把这个小提琴作为示例：http://jsfiddle.net/engemasa/WEm4F/，但我不想要按钮点击功能，我希望该系列动态地将其添加到图表中

Answer 1

你几乎就在那里，只需将你的代码置于你的API的成功范围内（angularjs api调用）。这是一个例子（我以前如何绘制关于数据变化的系列）

var metricData = $http.get(url);
metricData.success(function(value) {
var data = value.responseData;

var graph = [];
    angular.forEach(data.datatimeseries, function(metric) {
    graph.push([ metric.timestamp, metric.value ]);
// Assuming that datatimeseries is the timeseiries

});



var chartX = $('#yourDivId').highcharts();
chartX.addSeries({
    id : graph_id, // some id 
    data : graph 
});
setYaxisExtremes(chartX); // must use it to reflect added series
});

Answer 2

<强> ** **分辨

Altough有按钮，我可以解决这个问题。

我创建了一个存储库，它将Angular.js，PHP和Highcharts与Materialize.css集成，从外部JSON动态添加系列。

link：https://github.com/Nullises/DynamicSeriesHighchartsAngular