0

this is what I'm trying to do... I have a chart with a line series with markers in it. In the X axis I have dates and in the Y axis a number. So lets say I have in x dates from yesterday to next week. And each day has a corresponding Y axis value. What I want to do is change the color of the marker that belongs to the actual date. In other words, to make it clearer, I want to change the color of a single marker in a ExtJS line series. I know of markerConfig but that doesn't seem to help since it applies to all markers.

I haven't found anything like this around so I stopped here to see if you guys could help me. Thanks in advance!

martskins
  • 2,920
  • 4
  • 26
  • 52

1 Answers1

2

I think the easiest way to do this is to highlight a single datapoint in a series.

First, define your highlight style.

Ext.create('Ext.chart.Chart', {
...
series: [{
  type: 'line',
  highlight: {
    size: 10,
    radius: 10,
    fill: 'red'
  },
...
});

Then, select the appropriate datapoint in your series and call the highlightItem() method. Here's an example showing how to use the method.

var series = myChart.series.get(0);
series.highlightItem(series.items[2]);  // highlight the 3rd data point in the series

The result would look something like this.
enter image description here

Edenbauer
  • 1,306
  • 1
  • 11
  • 15
  • Hi @Edenbauer Can I change the marker type of that particular item of series ? Means one specific item in cross type and rest all in circle type? – Naveen Ramawat Sep 03 '14 at 10:32