IndexLabels format for rangeBar Charts

[aisolutions]

In the rangeBar comments, someone said “Yes its possible to show only one indexLabel in range charts. Range Charts have two indexLabels – one for each y value but you can show only one indexLabel using indexLabelFormatter. Check this example.”

I have to include the indexLabel in the dataPoints array. So how would I use that only one time in the chart? It seems that having indexLabel in the dataPoints array overrides this code:

indexLabelFormatter: function(e){
 if(e.index === 0)
     return " ";
 else
     return "Max: " + e.dataPoint.y[e.index];
 },
dataPoints: [
{x: new Date(2014,03,1), y: [ 17,33], indexLabel:"RFP"},  
{x: new Date(2014,03,2), y: [ 18,35], indexLabel:"RFP"},
{x: new Date(2014,03,3), y: [ 18,32], indexLabel:"RFP"},
{x: new Date(2014,03,4), y: [ 18,32], indexLabel:"RFP"},
{x: new Date(2014,03,5), y: [ 20,35], indexLabel:"RFP"},
{x: new Date(2014,03,6), y: [ 20,38], indexLabel:"RFP"},
{x: new Date(2014,03,7), y: [ 21,32], indexLabel:"RFP"}
]

[Vishwas R]

@aisolutions,

The indexLabel property set on a datapoint overrides the indexLabel & indexLabelFormatter defined at the dataseries level, which is why it’s not working as expected in your case.

To resolve this, you can remove the indexLabel property from the individual data points. If you still want to show the indexLabel from the data point as one of the labels (while hiding others), you can use a custom property name (e.g., indexLabel1) and access it inside indexLabelFormatter, as shown below:

indexLabelFormatter: function(e) {
    if (e.index === 0)
        return " ";
    else
        return e.dataPoint.indexLabel1;
},
dataPoints: [
    { x: new Date(2014, 3, 1), y: [17, 33], indexLabel1: "RFP" },
    { x: new Date(2014, 3, 2), y: [18, 35], indexLabel1: "RFP" },
    { x: new Date(2014, 3, 3), y: [18, 32], indexLabel1: "RFP" },
    { x: new Date(2014, 3, 4), y: [18, 32], indexLabel1: "RFP" },
    { x: new Date(2014, 3, 5), y: [20, 35], indexLabel1: "RFP" },
    { x: new Date(2014, 3, 6), y: [20, 38], indexLabel1: "RFP" },
    { x: new Date(2014, 3, 7), y: [21, 32], indexLabel1: "RFP" }
]

—
Vishwas R
Team CanvasJS