Question

我知道如何最初爆炸饼图楔形（简单地将相关数据项的爆炸设置为true），但我想要做的是在JavaScript中点击时楔入爆炸（该函数绑定到seriesClick事件）。当然，我希望重置任何其他爆炸楔形，这样一次只有一个爆炸楔形。

当然，我可以通过进行Ajax调用来获取图表来实现这一点，传递一个参数来指示被点击的楔形，但这非常低效，并且可能非常慢，取决于连接和复杂性。数据（和/或需要的运算）。

我在其他地方找到了同一问题的一个答案，但建议的解决方案不适用于剑道图表（设置了Kendo不支持的属性）。

如果有人在这方面有任何经验，我将非常感谢您对我的任何建议。

Answer 1

我在Kendo论坛上发现这篇文章要求同样的事情，看起来答案中可能有一个解决方案：

http://www.kendoui.com/forums/dataviz/chart/explode-slices-onseriesclick.aspx

它的要点是您需要更新数据中的“爆炸”字段，然后在单击后重新绘制图表。这可以通过“seriesClick”事件来完成：


    seriesClick: function(e){
        $( e.sender.dataSource.options.data ).each( function ( i, item ) {
              if ( item.source != e.category )
              {
                  item.explode = false;
              }
              else
              {
                  item.explode = true;
              }
        } );
        createChart();        
    }

我将基于此的工作JSFiddle放在一起：http://jsfiddle.net/derickbailey/FXs6b/

HTH

Answer 2

这是在Kendo UI for jQuery中执行“爆炸”的另一种方法：

seriesClick: function (e) {
  for (let i = 0; i < e.series.data.length; i++) {
    if (e.category === e.series.data[i].category) {
      e.series.data[i].explode = true;
    } else {
      e.series.data[i].explode = false;
    }
  }

  e.sender.setOptions(e.sender.options);
  e.sender.redraw();
},

无需重新创建图表。只需重置options和redraw。但是，如果要重新创建图表，请确保正确destroy。否则，将残留HTML残迹。您可能最终会得到同一事物的多个图表。

单击时如何爆炸剑道饼图楔形？

2 个答案: