浮動餅圖切換系列不起作用

Question

我已經應用了與該js小提琴相同的原理，但對於餅圖卻無法正常工作

 var options_pie = { series : { pie:{ show: true } }, grid : { clickable : true, hoverable : true }, legend: { labelFormatter: function(label, series){ //console.log(series); return '<a href="#" onClick="togglePlotPie(\\''+label+'\\'); return false;">'+label+'</a>'; }, noColumns: 3, } }; togglePlotPie = function(seriesIdx) { var someData = somePlotIncidents.getData(); var someDataActive; for(i=0;i < someData.length ;i++){ if(someData[i].label == seriesIdx) someDataActive = i; } console.log(someData); console.log(someData[someDataActive].pie.show); someData[someDataActive].pie.show = !someData[someDataActive].pie.show; console.log(someData[someDataActive].pie.show); /* if(someData[someDataActive].stack == 1) someData[someDataActive].stack = 0; else if(someData[someDataActive].stack == 0) someData[someDataActive].stack = 1; *///console.log(someData[seriesIdx].bars); console.log(someData); somePlotIncidents.setData(someData); somePlotIncidents.setupGrid(); somePlotIncidents.draw(); } var datasets = [{label:"P1",data:167,color:0,idx:0},{label:"P2",data:647,color:1,idx:1},{label:"P3",data:766,color:2,idx:2}]; somePlotIncidents = $.plot($("#network-graph"), datasets, options_pie); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="http://people.iola.dk/olau/flot/jquery.flot.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/flot/0.8.3/jquery.flot.pie.js"></script> <div id="network-graph" style="width:600px;height:400px"></div> 

Answer 1

對於餅圖，這種方式不起作用。 我對數據集進行了一些更改以使其工作。 這是小提琴 。 我為每個派添加了2個屬性。

var datasets = [{
  label: "P1",
  data: 167,    // this value is updated along with show 
  color: 0,
  idx: 0,
  show: true,
  oldData: 167   // this value is copied back to data on toggle
}, {
  label: "P2",
  data: 647,
  color: 1,
  idx: 1,
  show: true,
  oldData: 647
}, {
  label: "P3",
  data: 766,
  color: 2,
  idx: 2,
  show: true,
  oldData: 766
}];