通过以下这些事件,我应该能够检测Plotlines或Plotbands何时被鼠标移动并点击我的应用程序,但没有任何反应:(
http://api.highcharts.com/highcharts/xAxis.plotLines.events
ArrayList
我可以检测到的唯一鼠标操作位于以下outState.putParcelableArrayList(new ArrayList<Model>(models))
和xAxis: [
{
dateTimeLabelFormats: { hour: '%l:%M%P' },
id: 'main-x-axis',
events: {
setExtremes: prepareExtremes,
afterSetExtremes: afterSetExtremes
}
},
{
id: 'x-axis-alert',
plotLines: [{
id: 'alert-plotline',
zIndex: 1001,
events: {
click: function() {
console.log('plotLines Click')
},
mouseover: function() {
console.log('plotLines hover')
},
mouseout: function() {
console.log('plotLines out')
}
}
}],
plotBands: [{
id: 'alert-plotband',
zIndex: 1001,
events: {
click: function() {
console.log('plotBands clicked!');
},
mouseover: function() {
console.log('plotBands hover')
},
mouseout: function() {
console.log('plotBands out')
}
}
}],
linkedTo: 0,
showEmpty: false,
lineWidth: 0,
gridLineWidth: 0,
minorGridLineWidth: 0,
lineColor: 'transparent',
labels: { enabled: false }
}],
series [{
{
id: 'priceline',
name: 'price',
showInLegend: false,
zIndex: 1,
color: '#4C73FF',
data: [],
dataGrouping: { enabled: false },
point: {
events: {
mouseOver: function(event) {
TooltipFactory.updateToolTipPoints('price', event.target);
}
}
}
},
{
id: 'alert-series',
name: 'alert',
yAxis: 'y-axis-alert',
xAxis: 'x-axis-alert',
data: [],
color: 'rgba(254,235,236,0.1)',
lineColor: 'transparent',
showInLegend: false,
dataGrouping: { enabled: false },
lineWidth: 0,
minorGridLineWidth: 0,
point: {
events: {
click: function (event) {
console.log('alert-series clicked!');
}
}
}
}
}]
函数中。
此外,只有点击蓝线图的点时,才会激活chartClick。
TooltipFactory.formatTooltip
chartClick函数:
chartClick
答案 0 :(得分:0)
我找到了将PlotBands和PlotLines添加到图表中的区域:
const formatPlotBand = _.curry((color, alert) => {
return {
color : color,
from : toMilliseconds(alert.start_epoch),
to : toMilliseconds(alert.end_epoch),
id :'alert-plotband',
events: {
click: function(e) {
console.log('this',this)
console.log('alert-plotband Clicked', e);
},
mouseover: function(e) {
let target = {
name: alert.term,
type: alert.type,
percent: Math.floor(alert.percent_change)
}
TooltipFactory.updateToolTipPoints('alert', target);
},
mouseout: function(e) {
let target = {
name: '',
type: '',
percent: ''
}
TooltipFactory.updateToolTipPoints('alert', target);
}
}
}
});
const renderChartAlerts = _.curry((chart, alertObjects) => {
let plotLineData, plotBandData, alertSeriesData, xAxis, alertSeries;
xAxis = chart.get('x-axis-alert');
alertSeries = chart.get('alert-series');
alertSeriesData = _.map(alertObjects, prepareAlertSeries);
plotLineData = formatPlotLine(chart, 'rgba(254,235,236,0.5)');
plotBandData = formatPlotBand('rgba(254,235,236,0.1)');
plotLineData = _.map(alertObjects, plotLineData);
plotBandData = _.map(alertObjects, plotBandData);
alertSeries.setData(alertSeriesData);
_.each(plotLineData, (lineData, index) => {
xAxis.addPlotLine(lineData);
xAxis.addPlotBand(plotBandData[index]);
});
return chart;
});
现在我可以使用下面的这个click
函数,遇到问题但无法找到我点击的确切点。没有points
密钥。哦,这可能是另一个问题。
对不起我们的应用程序的结构方式,使其过于复杂,无法使用简单的jsFiddle示例。