Right Mouse Click Navigation on Treemap (for iPad Users)

MarkC

unread,

Jun 17, 2011, 5:47:16 AM6/17/11

to Google Visualization API

I have set up a treemap, and its working fine on a desktop / laptop.

However, the standard right mouse navigation 'up' the treemap doesn't
work on an iPad when either double-tapping OR tapping and holding.

Has anyone worked out a way around this?

Thanks

Michael Barker

unread,

Sep 18, 2013, 1:31:58 AM9/18/13

to google-visua...@googlegroups.com

Hi Dan,

here is the code they start you off with (below). I am curious where I put your code so that my maptree would dsiplay on an ipad. I tried a few different inserts, but nothing seemed to work -- and know it is me (since I don't really know code at all) not your code.

Thanks for the help!

Mike

<html><br />
<head><br />
    <script type="text/javascript" src="https://www.google.com/jsapi"></script><br />
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["treemap"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {

        // Create and populate the data table.
        var data = google.visualization.arrayToDataTable([

On Sunday, November 18, 2012 1:42:38 AM UTC-5, Dan Moran wrote:

hmm, third post is the charm, I swear.

You can only create the mousewheel handler after the treemap has been fully rendered. So the code should be

function drawChart(){
//...
// Create the chart here
// ....

// Add a mousewheel handler when the chart has been drawn
google.visualization.events.addListener(tree, 'ready', function(){
document.getElementById('chart_div').onmousewheel = function(e){
if ("wheelDelta" in e) if (e.wheelDelta<0) return; // Only consider scrolling in one direction
if (tree) tree.goUpAndDraw();
}
});

} // createChart()

-r

Dan Moran

unread,

Sep 30, 2013, 9:12:53 AM9/30/13

to google-visua...@googlegroups.com

Hi Michael,

Getting this working on an ipad will take some code. You need to write code to translate some gesture (swipe, long press, or something else) into a right mouse click. And as much as we would love to, I can advise against trying to implement pinch-to-zoom-out. Pinch to zoom is currently patented by Apple and there is no consistent, nice way to implement it in Javascript. Of course there are hacks but in my (extensive) experience they don't end up working well or consistently.

Personally I'd go for long-press = right click

http://stackoverflow.com/questions/14876301/javascript-translate-long-tap-events-to-right-click-events

Or, I'd overlay a Zoom Out button on top of the treemap. Not as elegant as a gesture control but could end up easier.

Cheers & good luck,

Dan

--
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/LCQWU3JkHG0/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.

Reply all

Reply to author

Forward