高图-只显示选定的点
Highcharts - show only selected points
我想有一条线,只显示选中的点(它们实际上是预先选定的)。
在这个例子中- http://jsfiddle.net/jhG8j/-你可以显示选中的点,当你点击按钮,但我只能让它工作,如果所有其他点已经显示(标记:启用)。是否有一种方法可以从一条平线开始,然后只显示选定的点?
下面是来自jsfiddle的相关代码:
$(function () {
$('#container').highcharts({
plotOptions: {
line: {
marker: {
enabled: true
}
}
},
series: [{
data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
}]
});
// button handler
var chart = $('#container').highcharts(),
i = 0;
$('#button').click(function() {
if (i == chart.series[0].data.length) {
i = 0;
}
chart.series[0].data[i].select(true, true);
i++;
});
});
您可以通过创建两个单独的系列来解决这个问题。为了使您的系列看起来像一个折线图,您需要在数据中添加一些null,并确保第一个系列的最后一个数据点是下一个系列的第一个数据点。
使用您提供的jsfiddle,更新后的代码如下:$(function () {
$('#container').highcharts({
plotOptions: {
line: {
}
},
series: [{
data: [29.9, 71.5, 106.4] ,
marker: {
enabled: true
} ,
color: '#000000'
},{
data: [null, null , 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4] ,
marker: {
enabled: false ,
states: {
hover: {
enabled: false
} ,
states: {
select: false
}
}
},
color: '#000000'
}]
});
// button handler
var chart = $('#container').highcharts(),
i = 0;
$('#button').click(function() {
if (i == chart.series[0].data.length) {
i = 0;
}
chart.series[0].data[i].select(true, true);
i++;
});
});
相关文章:
- 有效形式-始终只显示1个错误[角度]
- Magento网站上线直播服务器只显示主页
- 操作javascript变量[HTML]以只显示文本
- 如何在设定的时间间隔内一次只显示一个图像
- ¿如何每天只显示一次特定的容器
- 检查搜索结果是否存在多次如果是,则在Javascript中只显示一个结果
- 谷歌地图-数据库中的标记只显示最后一行的信息
- 点击时的qtip2只显示一次
- 在高图表中,每x步只显示标签
- GoogleMapsV3api只显示Javascript循环中的一些标记
- 旧的javascript幻灯片只显示wihtout幻灯片(onclick)
- jquery只显示子项
- 每个用户只显示一次放大弹出窗口
- 数据应该只显示与我单击的按钮有关的信息
- Bootstrap Alert只显示一次
- Angular js将只显示ng repeat中的第一个元素
- 打印从Spring MVC Controller发送的字符串数组只显示“;toJSON”;在javascript中
- Facebook API过滤用户活动,只显示指定的好友
- 单击旧列表只显示上次创建的id,应在单击时显示列表id
- 我的砖石图像只显示在一列中