CODEWITHSUNDEEP
highcharts
tharini
tharini

Reputation: 15

Highstock Change date format dynamically on clicking range selector button

I have set up a jsfiddle example http://jsfiddle.net/FQjuY/1/

I'm formatting 1D tab using the following code snippet

 var df='%a, %b %e %I:%M %p';
 tooltip : {
            formatter : function(){
                var s=Highcharts.dateFormat(df, this.x);
                s+="<br/>";
                $.each(this.points, function(i, series){
                    s += '<span style="color:' + this.series.color + '">' + this.series.name + '</span> : <b>'+ this.y.toFixed(2) +'</b><br/>';
                }); 
                return s;
        }
        }

I want to dynamically change the date format for 1H and ALL tabs separately when i click on the tab. Thanks in advance.

Upvotes: 0

Views: 1506

Answers (1)

Paweł Fus
Paweł Fus

Reputation: 45079

You can get selected button via:

var selected = this.points[0].series.chart.rangeSelector.selected;

Then if you will define df that way: 

var df=['%I:%M %p','%a, %b %e %I:%M %p','%a, %b %e'];

You can simply get required tooltip format: 

var s=Highcharts.dateFormat(df[selected], this.x);

See: http://jsfiddle.net/FQjuY/2/

Another solution is to just get range from:

var range = this.points[0].series.points[1].x - this.points[0].series.points[0].x

And now according to range use specific format for date.

Upvotes: 1

Related Questions