将自定义属性添加到flot数据

时间:2013-07-23 11:38:11

标签: jquery flot

问题

当我将数据传递到flot中时,如果我可以传递一些我想在触发plotclick事件时访问的补充数据,这将非常方便。

我的数据

以下是一些标准数据;

[{label: 'first', data: 5, color: '#123'},
{ label: 'first', data: 10, color: '#456'}]

我希望能够做类似的事情;

[{label: 'first', data: 5, color: '#123', my_custom_attribute: 'some data'},
{ label: 'first', data: 10, color: '#456', my_custom_attribute: 'some more data'}]

所以我可以在plotclick事件中进行;

$('chart').bind('plotclick', function(event, pos, item) {
  console.log(item.series.my_custom_attribute) //Or something to that effect
});

我尝试了什么

我尝试过插入上面的内容并查看item事件中plotclick的返回内容,但它似乎不会将my_custom_attribute存储在任何地方。

我已阅读https://github.com/flot/flot/blob/master/API.md处的文档,无法查看任何相关信息。

我搜索了谷歌和这里的答案,找不到符合我需要的答案。

更新

感谢Khawer Zeshan提供解决方案,这仍然不适合我;

这是我传递的数据;

[{breakdown: "test", color: "#00A4D3", data: 1.5, label: "History"},
 {breakdown: "test", color: "#1464F6", data: 0, label: "Geography"}]

breakdown属性没有出现在item的输出中。

图表上的其他所有内容似乎都有效。

3 个答案:

答案 0 :(得分:2)

你做对了。您可以根据自己的喜好使用自定义数据参数

data = [{ data:data1, label:"fixed", lines:{show:true}, my_custom_attribute: 'somedata'}];

您可以按照以下方式获取自定义数据

$("#placeholder").bind("plotclick", function (event, pos, item) {
        if (item) { 
            alert(item.series.my_custom_attribute);
        }
    });

FIDDLE

答案 1 :(得分:2)

试试这个

如果您通过初始化图表时使用的原始 data 变量查找自定义数据。数据仍将存在。由于某些原因,无法通过 item 直接访问数据...它似乎被删除了。

var data = [
{ label: "Series1",  data: [[1,1]],  myData: "test 1"},
{ label: "Series2",  data: [[1,1]],  myData: "test 2"},
{ label: "Series3",  data: [[1,1]],  myData: "test 3"},
{ label: "Series4",  data: [[1,1]],  myData: "test 4"},
{ label: "Series5",  data: [[1,1]],  myData: "test 5"},
{ label: "Series6",  data: [[1,5]],  myData: "test 6"}
];


$.plot($("#placeholder"), data, {
    series: {
        pie: { 
            show: true
        }
    },
    grid: {
        hoverable: true,
        clickable: true
    }
});



$("#placeholder").bind("plotclick", function (event, pos, item) {
if (item) { 
       console.log(data[item.seriesIndex]);
    }
});

希望有所帮助!

答案 2 :(得分:0)

<强>的console.log(数据[item.seriesIndex]);

它对我有用......

对于较新版本(0.8),自定义变量可直接以系列级别提供,例如

<强>的console.log(item.series.my_custom_attribute);

但是对于较小版本的seriesIndex方式应该可行..

非常感谢@Milk Man