【Highcharts饼图】动态给饼图添加数据时，绘制“卡住”的情形

最近需要给highcharts的饼图添加数据，用到以下语法：

pieChart.addSeries({      type:'pie',      name:'数量分布',      data:countData});

 其中，pieChart为一个highcharts对象。countData的组成如下：

var countList = data.list;//ajax获得的从后台传递过来的List<Map<String, Object>>集合，这个集合中的元素是一个map，每个元素的key是对应饼图的每块区域的name, vlaue则是每块代表的值的大小。//解析成highcharts饼图所用的数据结构var countData = [];for(var i=0; i<countList.length; i++) {   var tmp = countList[i];   countData.push([tmp.key, tmp.value]);}

 本来这样做无可厚非，但是我发现竟然会在pieChart的addSeries操作之后重绘：pieChart.redraw()这里“卡住不动”。。半天没找到原因。

结果后来才发现，这种情况并不是每次都出现；而出现不能redraw的原因是此时饼图的数据结构类似如下：

[{name1:100, name2:0, name3:0, name4:0}]

仔细观察就会发现，传过来的数据只有name1对应的值不为0，其他都为0；当你动态添加数据时，只有一个区块有值，饼图是无法绘制或重绘的；结合饼图的本意不难理解：饼图是用于展示每种区块在数值上的“大小瓜分”情况的，当然是每个区块的值不为0才有实际意义~~

而当你解析过的数据结构如下：

[{name1:100, name2:10, name3:0, name4:0}]

时，即不是只存在一个数值不为0，但还是存在数值为0的区块时，这时候饼图的绘制能进行，但是饼图的显示会“错乱”（具体可自己尝试）。

 

解决办法：在后台处理，当一个区块的值不为0时，才把它对应的map加入集合里面。这样，动态绘制饼图时，饼图只会显示有数值（>0）的区块的分布情况~

然而，静态饼图的绘制则没有如上限制。。