It is possible to make a paging system like that which uses a DataView to
restrict the visible rows of data. For a pre-packaged solution, however, I
suggest taking a look at the ChartRangeFilter
<https://google-developers.appspot.com/chart/interactive/docs/gallery/controls#chartrangefilter>.
If that won't work for you, I can help you set up a paging system.
On Wednesday, August 27, 2014 12:35:23 AM UTC-4, Richie Khandelwal wrote:
>
> Hi,
>
> I am fairly new to charting and google visualization API. I get data from
> my application in JSON format with three columns: date, number, and text
> string
>
> I use the following code to chart it:
>
> function drawChart(graph_data) {
>
> var data = new google.visualization.DataTable();
> data.addColumn('date', 'Days');
> data.addColumn('number', 'pressure');
> data.addColumn({type: 'string', role: 'tooltip'});
>
> data.addRows(graph_data.length);
>
> $.each(graph_data, function (i, points) {
> var date = points[0].split("-");
> data.setCell(i, 0, new Date(parseInt(date[0]), parseInt(date[1]),
> parseInt(date[2])));
> data.setCell(i, 1, points[1]);
> data.setCell(i, 2, 'pressure = '+points[1]+' '+points[2]);
> });
>
> var first_column = data.getDistinctValues(0);
> var graph_width = (data.getNumberOfRows() * 70);
> var options = {
> title: 'Daily price',
> width: graph_width,
> height:$("#chart_div").height(),
> backgroundColor: 'white',
> lineWidth: 5,
> legend: 'none',
> pointSize: 10,
> pointShape: 'circle',
> chartArea: {left: 75, width: '97%'},
> hAxis: { ticks: first_column, format: 'MM/dd' }
> };
>
> var chart = new
> google.visualization.LineChart(document.getElementById('chart_div'));
> chart.draw(data, options);
> }
>
> This works great as you see in the attached photo.
> However, now I want to add two more things that I am struggling with.
>
> 1. Instead of the scroll bar at the bottom, I want to restrict view window
> to 15 days and add buttons to dynamically move chart to next 15 days
> 2. More importantly - The x axis right now has data as MM/dd as you see -
> I am wondering if it is possible to create 2 x-axis one that has dates and
> the other that has month - some what like how momondo has it. See attached
> photo. (note - don't want bars just the way x-axis is handled
>
> Can someone help?
>
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to google-visualization-api+unsubscr...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/d/optout.
