2017-01-11 4 views
0

캔버스 js를 사용하여 도넛 차트를 만들고 있습니다. XML에서 응답을 가져오고 데이터 포인트를 가리키는 사용자 정의 js 코드를 사용하고 있습니다.하나의 차트 대신 두 개의 차트 형성

여기에서 그래프의 유형을 "선"으로 변경하면 그래프는 변경 될 때와 같이 동작합니다. 차트 유형이 "파이"또는 "도넛"으로 바뀌 었으므로 지금은 하나의 차트 대신 2 개의 차트를 제공합니다. 어떻게 작동하여 빛을 통해 누군가를 기쁘게 할 수 있었습니까?

내 코드

$scope.loadChartValue = function (data, scopes) { 
     scopes.data_id = []; 
     scopes.legend_text = ""; 
     scopes.inner_chart_data = []; 

     for (var i = 0; i <= data.length; i++) { 
      var arrayvalue = data[0].data[i]._attr; 
      if (existsInArray(scopes.data_id, arrayvalue.label._value) == false) { 
       scopes.data_id.push(arrayvalue.label._value); 
      } 
     } 
     for (var i = 0; i < scopes.data_id.length; i++) { 
      scopes.inner_chart_data = []; 
      for (var j = 0; j <= data.length; j++) { 
       if (data[0].data[j]._attr.label._value == scopes.data_id[i]) { 

        scopes.inner_chart_data.push({ label: data[0].data[j]._attr.label._value, y: data[0].data[j]._attr.value._value }); 
        scopes.legend_text = data[0].data[j]._attr.label._value; 
       } 
      } 
      scopes.dataset.push(
         { 
          type: "doughnut", 

          markerType: "circle", 
          markerSize: scopes.markersize, 
          color: scopes.chart_color_value[i], 
          showInLegend: true, 
          name: scopes.legend_text, 
          legendText: scopes.legend_text, 
          dataPoints: scopes.inner_chart_data 
         } 
       ); 
     } 
     scopes.data_length = data.length/scopes.data_id.length; 
    } 

답변

1

Line, Column 및 다른 차트 유형 multi-series/doughnutpie 반면 것은 하나의 시리즈 차트입니다 지원합니다.

여러 데이터 포인트가있는 데이터 시리즈가 아닌 여러 데이터 시리즈를 만듭니다. 복수 dataSeries이 아닌 복수 dataPoints 인 단일 시리즈를 만드는 것이 좋습니다.