KendoUI：如何在事件中获取单击的图表元素项的索引

Question

我想访问以下事件的索引：seriesClick和seriesHover。我在这里只看到如何访问文档中特定栏的值和类别http://docs.kendoui.com/api/dataviz/chart#events-series单击但不单击项目所基于的原始对象的数据。

Answer 1

例如，您可以访问e.dataItem中的各个数据项，因此可以执行以下操作：

var data = e.sender.dataSource.data();
for (var i=0; i < data.length ; i++) {
    if (e.dataItem.uid === data[i].uid) {
        console.log("index " + i);
    }
}

如果这就是你所说的"指数"。

您还可以访问e.series中的系列数据（但所有这些都在文档中）。

Answer 2

剑道图的默认数据序列是一个数值数组。这些值没有uid，因为它们不是对象。

创建一个对象数组，而不是在序列对象中创建一个数字数组。在series元素中，创建一个名为"field"的属性，并用对象中包含要绘制图表的数值的字段的名称填充该字段。此对象将有一个uid。我这样做是为了让我可以将url与数据点相关联，并在单击时移动到该页面。

我的对象是用C#创建的，并使用JSON传递，但您可以随心所欲地创建这些对象。

public class DowntimeAnalysisSeries : DatabagUtility
{
    public string name { get; set; }
    public string field { get; set; }
    public DowntimeAnalysisDatapoint[] data { get; set; }
    //public  decimal[] data { get; set; }
    public string color { get; set; }
}
public class DowntimeAnalysisDatapoint
{
    public decimal dataValue { get; set; }
    public string url { get; set; }
}

现在您可以使用Lars Höppner上面描述的逻辑。一旦我把我的数据放入一个对象中，我就不再需要知道索引了，因为Kendo把它给了我

我通过在图形设置中放入以下行来附加到系列点击事件：

seriesClick: function (e){rla_summaryBarClicked(e);}

我调用的函数如下：

    function rla_detailBarClicked(e) {
        var item = e.dataItem;
        var url=item.url;
        // do stuff with url here...
        }
    }

我填充到dataItem中的所有信息对我来说都是可用的。

Answer 3

我在事件结构中找不到成员e.series或e.uid，这是下一个：

e: Object
_defaultPrevented: false
category: Tue Jul 05 2011 12:00:00 GMT+0400
element: S.fn.init[1]
isDefaultPrevented: function (){return this._defaultPrevented===!0}
preventDefault: function (){this._defaultPrevented=!0}
sender: vn.extend.init
value: 9.833887
__proto__: Object

但在同一时间数组项中，它有：

100: i.extend.o
DateTimeLocal: Sat Jul 02 2011 00:00:00 GMT+0400
DateTimeUTC: "/Date(1309554000000)/"
Value: 0.6488973049506388
_date_DateTimeLocal: Sat Jul 02 2011 00:00:00 GMT+0400
_events: Object
dirty: false
parent: function (){return r}
uid: "e5376556-c50b-4653-8889-5eb4ea7c2c28"

DateTime比较也没有给出应用此块的结果

var data = e.sender.dataSource.data();
for (var i = 0; i < data.length ; i++) {
    var d = data[i].DateTimeLocal;
    if (e.category == data[i].DateTimeLocal) {
        console.log("index " + i);
    }
}

Answer 4

对我来说，这就是工作原理：

 seriesClick: function (e) {
      var data = e.series.data;
      for (var i = 0; i < data.length ; i++) {
      if (e.dataItem === data[i]) {
           console.log("index " + i);
      }
 }