PDA

View Full Version : need help for quick tips for chart



abhinavchugh
3 Oct 2012, 12:17 AM
Hi


I have a chart
var chart1 = Ext.create('Ext.chart.Chart', {
height:500,
width:500,
renderTo: 'div3',
id: 'chartCmp1',
xtype: 'chart',
insetPadding: 25,
//theme: 'Browser:gradients',
shadow:true,
style: 'background:#fff',
animate: true,
shadow: true,
gutter:50,
store: store,
axes: [{
type: 'Numeric',
position: 'left',
axisStroke: '#FFF',
fields: ['Investment'],
label: {
renderer: Ext.util.Format.numberRenderer('0,0')
},
maximum:500,
minimum:-500
}, {
type: 'Category',
position: 'bottom',
fields: ['name']
}],
series: [{
type: 'column',
axis: 'left',
gutter: 5,
highlight: true,
// tips:m, //I am not giving tips configuraion here..coz i want to use quick tips for chart
label: {
display: 'insideEnd',
'text-anchor': 'middle',
field: 'Investment',
renderer: Ext.util.Format.numberRenderer('0'),
orientation: 'vertical',
color: '#333'
},
xField: 'name',
yField: ['Investment'],
label: {
display: 'insideEnd',
field: 'name',
//renderer: Ext.util.Format.numberRenderer('0'),
orientation: 'horizontal',
color: '#FFF',
'text-anchor': 'right'
}


}],
legend: {
boxStroke: '#FFF',
position: 'top left'

}
}); and i m giving the chart id as a target in quick tip registration.i.e.
Ext.tip.QuickTipManager.register({
autoHide:true,
target: 'chartCmp1',
title: 'My Tooltip',
text: 'This tooltip was added in code',
width: 100


});.

Issue No 1: By this code Tool tip comes as soon as when i hover the mouse on chart dom, i want to display the tips only at at the bars of chart by using quick tips.
Issue No 2 : I am not able to give the renderer in the quick tips registarion while giving the target.

P.S. I dont want to use the tips property of series in chart i.e.

series: [{
type: 'column',
axis: 'left',
gutter: 5,
highlight: true,
// tips:m // i dont want to use this property

mitchellsimoens
10 Oct 2012, 8:32 AM
Why don't you want to use the tips config on the series? It will show the tip when you mouse over a series item