PDA

View Full Version : markerConfig



TMDBrett
26 Sep 2011, 9:03 AM
Can anyone tell me why my series seems to be ignoring my markerConfig object


{
type: 'line',
markerConfig: {
type: 'circle',
radius: 100

},
selectionTolerance: 15,
highlight: {

size: 7,
radius: 7
},
axis: 'left',
smooth: true,
xField: 'visitweek',
yField: 'patientdata',
title: 'Patient Data',
style: {
stroke: "#C20C51",
connectDiscontinuousPoints:true,
discontinuousDashLength:5000
},
showMarkers: true




}

Di Peng
27 Sep 2011, 11:07 AM
Hi my markerConfig also get ignored and I have very similar code to yours. Can somebody solve our problem please
Thanks

Stari4egg
13 Oct 2011, 10:41 AM
+1 Have the same problem

dbredesen
23 Oct 2011, 10:29 AM
Has anyone had any success getting markerConfig to work? It is completely ignored in my line chart configuration.

Thanks,
D

samsonfr
3 Nov 2011, 9:19 AM
I was going crazy and then I searched to Web and found this forum.
I suppose we need to wait a new version.
Anyone found a workaround?

hermanvandermaas
5 Dec 2011, 3:55 AM
I have the same problem: +1 for this question.

ayee879
6 Dec 2011, 9:58 AM
Looking at the code itself it doesn't even use markerConfig. you have to use markerStyle, or define it in a theme.

Leonardo_redmond
8 Dec 2011, 10:37 AM
I also have same problem. I'm trying to make a bigger marker, But using markerConfig, I can't.

touch chart doesn't support it?

Cangot
9 Dec 2011, 9:22 AM
Hi,

I changed my marker config using a custom theme.
I just couldn't find how to use simple object configuration.

hermanvandermaas
20 Jan 2012, 7:22 AM
As a workaround, you can change the marker configuration directly on each series object after the chart has rendered, and then redraw the chart. This code worked for me.


// First series
mychart.series.items[0].markerStyle.style = {
radius: 15
// Etc.
};

// Second series
mychart.series.items[1].markerStyle.style = {
radius: 15
// Etc.
};

mychart.redraw();

Not elegant at all but it works.

==

This is a better solution (there seems to be a bug in touch-charts.js). Replace this line of code in the touch-charts.js file:


//prepare style objects for line and markers
endMarkerStyle = Ext.apply({}, markerStyle, me.markerConfig);

With this:


//prepare style objects for line and markers
endMarkerStyle = Ext.apply({}, me.markerConfig, markerStyle);

==

All available markerConfig options can be found here in the API docs: http://docs.sencha.com/touch-charts/1-0/#!/api/Ext.draw.Sprite

Naga
2 Feb 2012, 3:02 AM
Yes I think there is a bug regarding this marker config in sencha charts,

Temporarily I found a solution which works fine for me,

I have replaced below code

{ "selector": "chart[cls=\"line1\"] series:nth-child(1) marker",
"style": {
"type": "circle",
"size": 2,
"radius": 2,
"fill": "#FE1817",
"stroke-width": 0
},
"specificity": [
0,
2,
3
]
},
{
"selector": "chart[cls=\"line1\"] series:nth-child(2) marker",
"style": {
"type": "plus",
"size": 2,
"radius": 2,
"fill": "#005337",
"stroke-width": 0
},
"specificity": [
0,
2,
3
]
},
{
"selector": "chart[cls=\"line1\"] series:nth-child(3) marker",
"style": {
"type": "cross",
"size": 2,
"radius": 2,
"fill": "#0C02FB",
"stroke-width": 0
},
"specificity": [
0,
2,
3
]
},


instead of this default code in touch-charts-debug.js and in themeList.js


{ "selector": "chart[cls=\"line1\"] series:nth-child(1) marker",
"style": {
"type": "image",
"height": "46",
"width": "46",
"src": "\"../resources/shared/img/iphone.png\""
},
"specificity": [
0,
2,
3
]
},
{
"selector": "chart[cls=\"line1\"] series:nth-child(2) marker",
"style": {
"type": "image",
"height": "46",
"width": "46",
"src": "\"../resources/shared/img/android.png\""
},
"specificity": [
0,
2,
3
]
},
{
"selector": "chart[cls=\"line1\"] series:nth-child(3) marker",
"style": {
"type": "image",
"height": "46",
"width": "46",
"src": "\"../resources/shared/img/ipad.png\""
},
"specificity": [
0,
2,
3
]
},

Now it's working fine for me

Regards,

Nag.