Unvariable interval with ChartRangeFilter

[Damien Lécole]

Hi,

I am new to the Google Visualization API.

I would like to get a chart looking like the one in the following website : http://letour.yorkshire.com/stage-1 . I have thought of using the ChartRangeFilter ControlWrapper. I try handling the statechange events to get an invariable interval but I haven't succeed.

Here is my code :

      function stateChangeHandler(a){    

if (a.startChanged == true && a.endChanged == true){

var chart = document.getElementById("chart");

var pos = (control.getState().range.end + control.getState().range.start)/2;

chart.style.left = pos*4;

}

if (a.startChanged == false && a.endChanged == true ){

control.setState({'range': {'start': control.getState().range.end-10, 'end': control.getState().range.end}});

control.draw();

var chart = document.getElementById("chart");

var pos = (control.getState().range.end + control.getState().range.start)/2;

chart.style.left = pos*4;

        }

        if (a.startChanged == true && a.endChanged == false){

control.setState({'range': {'start': control.getState().range.start, 'end': control.getState().range.start+10}});

var chart = document.getElementById("chart");

var pos = (control.getState().range.end + control.getState().range.start)/2;

chart.style.left = pos*4;

}

}

Here is the link so you can see the my problems : http://wgs3.s3.amazonaws.com/perso/dlecole/ASO/chartrangefilter.html

Do you have any idea how to do or if there is a more adapted solution without using ChartRangeFilter?

Regards,

Damien Lécole

[asgallant]

You might be better off using a custom slider solution for this, as calling control.draw interrupts the mouse events that are allowing the user to drag the slider.  There are many libraries out there that have sliders you can use.

I made a feature request to add support for an option that would allow you to get your fixed range: http://code.google.com/p/google-visualization-api-issues/issues/detail?id=1359.  You can "star" the issue to get updates and let the dev team know there is interest in the feature.

[Damien Lecole]

Hi,

Thanks a lot for your answer !! 

I don't have to develop the application now so it might be better for me to wait for the implementation of the maxRangeSize feature. In case it's not done when I'll need it, I'll follow your advice : using a custom slider. But there is something I can't work out. 

What I understand :

* use a LineChart (or an AreaChart) to display my whole chart

* overlay this chart with my slider

* while sliding the "infowindow" will move along the slider

* display " another chart containing only the requested value in this "infowindow

For now I don't see how to do the connection between the data from the first chart and the second one.

Any idea on how to do that?

Thanks again,

Damien

Conférence des Utilisateurs WGS Portal 2013 20 & 21 Novembre Inscrivez-vous !

 

2013/11/13 asgallant <drew_g...@abtassoc.com>

--
You received this message because you are subscribed to a topic in the Google Groups "Google Visualization API" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/google-visualization-api/-ohoNvcaZko/unsubscribe.
To unsubscribe from this group and all its topics, send an email to google-visualizati...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/groups/opt_out.

[asgallant]

I think the answer is going to depend on the nature of the relationship between the data in the first chart and the data in the second chart.

2013/11/13 asgallant <drew_g...@abtassoc.com>

To unsubscribe from this group and all its topics, send an email to google-visualization-api+unsub...@googlegroups.com.