2015-12-01 10 views
0

Я использую интерфейс Kendo и пытаюсь отобразить несколько диаграмм на одной веб-странице. Все работает, пока я не попытаюсь добавить вторую гистограмму. Одна из диаграмм не отображается и просто показывает общее изображение диаграммы (похоже, что она не находит данные, но если я переупорядочу, они отменили бы то, что происходит). Я могу отображать несколько линейных диаграмм. Любые идеи о том, что может произойти?Kendo отображает несколько диаграмм на веб-странице

Ниже мой HTML для двух карт без информации SVG:

<div kendo-chart="" k-options="vm.barChartOptions" ng-show="this.dataItem.visible" class="move k-block ng-scope k-chart" id="costPerPound" style="float: left; margin: 5px 0px; position: relative;" data-uid="b543ff9a-ee57-4ce7-a39d-8f69a0505a2b" role="option" aria-selected="false" data-role="chart"></div> 
<div kendo-chart="" k-options="vm.barChartOptions" ng-show="this.dataItem.visible" class="move k-block ng-scope k-chart" id="numShipments" style="float: left; margin: 5px 0px; position: relative;" data-uid="97094bf1-4366-4974-b92f-edf36d1980f4" role="option" aria-selected="false" data-role="chart"></div> 

Вот это информация к-опции. Как вы видите, я устанавливаю большую часть своей информации при рендеринге.

 vm.barChartOptions = { 
     dataSource: vm.chartData_datasource, 
     series: [ 
      { 
      } 
     ], 
     valueAxis: { 
      line: { 
       visible: false 
      }, 
      labels: { 
       rotation: "auto" 
      } 
     }, 
     tooltip: { 
      visible: true, 
      template: "#= series.name #: #= value #" 
     }, 
     render: function (e) { 
      var chart = e.sender; 
      var chartData = vm.findChartData(e); 
      if (chartData != null) { 
       chartData.categoryAxisField = vm.firstToLower(chartData.categoryAxisField); 
       chart.options.title.text = chartData.title; 
       chart.options.name = chartData.htmlID; 
       chart.options.categoryAxis.field = chartData.categoryAxisField; 
       chart.options.categoryAxis.labels.format = chartData.categoryAxisLabel; 
       chart.options.legend.position = chartData.legendPosition; 
       chart.options.seriesDefaults.type = chartData.chartType; 
       for (var i = 0; i < chart.options.series.length; i++) { 
        chart.options.series[i].type = chartData.chartType; 
        chart.options.series[i].field = vm.firstToLower(chartData.dataField); 
       } 
      } 

     } 
    } 

ответ

0

У меня был такой же выпуск. Его можно решить, просто указав другое имя на каждый график.