How to capture the exact series name from item click on a line chart
I am trying to capture the exact series name from the item click on a line chart my code looks like the following
Code:
function showChart() {
var store = Ext.data.JsonStore{ (
fields: [ 'date', 'sales', 'rev' ],
url: 'chartRender.jsp'
root: 'data',
autoLoad: true
} );
var chartPanel = new Ext.Panel ( {
title: 'Sales and Revenue Chart'
renderTo: 'container',
width: 1000,
height: 500,
layout: 'fit',
items: {
xtype: 'linechart',
store: store,
xField: 'date',
xAxis: new Ext.chart.CategoryAxis( {
title: 'date'
} ),
yAxis: new Ext.chart.NumericAxis ( {
title: 'USD'
} ),
series: [ {
yField: 'sales',
displayName: 'Sales'
}, {
yField: 'rev',
displayName: 'Revenue'
} ],
listeners: {
itemclick: function(o) {
// HOW DO I GET THE NAME OF THE SERIES THE USER CLICKED?
// WHAT IS THE "o" OBJECT BEING PASS IN AND WHAT METHODS OR CONTANTS CAN I CALL ON IT?
// THE CODE BELOW ONLY GIVES THE INDEX TO THE STORE BUT DOES NOT SAY WHICH SERIES WAS CLICKED BY THE USER
var rec = store.getAt(o.index);
}
}
});
}
Please help the Ext JS Documentation is not very good and I get confused just trying to find what other listeners can I use and how to use them. I have been trying to figure this out for two days with no progress.