PDA

View Full Version : Bar Chart Series Label not positioning correctly



ZyBeR
6 Aug 2014, 7:17 AM
How can I make the label not position itself on or left of the border? Like 4 and 5 pins have done?

It would be ok to have them on top of the bar it self.

49868



{
xtype: 'chart',
flex: 1,
height: 250,
width: 400,
items: {
type: 'text',
text: 'First Shot Results',
width: 100,
height: 30,
x: 50,
//the sprite x position
y: 10//the sprite y position
},
animate: true,
insetPadding: 20,
store: 'FirstShotResults',
theme: 'Purple',
axes: [
{
type: 'Category',
fields: [
'name'
],
position: 'left'
},
{
type: 'Numeric',
fields: [
'data'
],
hidden: true,
position: 'bottom',
decimals: 0
}
],
series: [
{
type: 'bar',
label: {
contrast: true,
display: 'outside',
field: 'data',
color: '#333',
'text-anchor': 'middle'
},
axis: 'bottom',
xField: 'name',
yField: 'data',
xPadding: 30
}
]
}

scottmartin
6 Aug 2014, 1:36 PM
Since you have changed the default font size, you would most likely need to look at the offset distance in label: { display: 'outside' }

ZyBeR
6 Aug 2014, 10:40 PM
Where have I changed font size?I've changed font color but not size afaik?

scottmartin
7 Aug 2014, 6:51 AM
Where have I changed font size?I've changed font color but not size afaik?

My mistake, I thought by the look of the image, the text was rather large and bolded.
No CSS changes?

Any how, can you create a small test case of your entire chart with data.
https://fiddle.sencha.com/#home