Форк Rambox
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

75 lines
2.3 KiB

/**
* The ItemInfo interaction allows displaying detailed information about a series data
* point in a popup panel.
*
* To attach this interaction to a chart, include an entry in the chart's
* {@link Ext.chart.AbstractChart#interactions interactions} config with the `iteminfo` type:
*
* new Ext.chart.AbstractChart({
* renderTo: Ext.getBody(),
* width: 800,
* height: 600,
* store: store1,
* axes: [ ...some axes options... ],
* series: [ ...some series options... ],
* interactions: [{
* type: 'iteminfo',
* listeners: {
* show: function(me, item, panel) {
* panel.setHtml('Stock Price: $' + item.record.get('price'));
* }
* }
* }]
* });
*/
Ext.define('Ext.chart.interactions.ItemInfo', {
extend: 'Ext.chart.interactions.Abstract',
type: 'iteminfo',
alias: 'interaction.iteminfo',
/**
* @event show
* Fires when the info panel is shown.
* @param {Ext.chart.interactions.ItemInfo} this The interaction instance
* @param {Object} item The item whose info is being displayed
* @param {Ext.Panel} panel The panel for displaying the info
*/
config: {
/**
* @cfg {Object} extjsGestures
* Defines the gestures that should trigger the item info panel to be displayed in ExtJS.
*/
extjsGestures: {
'start' : { event: 'click', handler: 'onInfoGesture'},
'move' : { event: 'mousemove', handler: 'onInfoGesture'},
'end' : { event: 'mouseleave', handler: 'onInfoGesture'}
}
// TODO:ps The trigger above should be 'itemclick', not 'click'.
},
item: null,
onInfoGesture: function (e, element) {
var me = this,
item = me.getItemForEvent(e),
tooltip = item && item.series.tooltip;
if (tooltip) {
tooltip.onMouseMove.call(tooltip, e);
}
if (item !== me.item) {
if (item) {
item.series.showTip(item);
} else {
me.item.series.hideTip(me.item);
}
me.item = item;
}
return false;
}
});