Google Maps – Behind the scenes

When we first started working on Project Butterfly, we set a goal to revolutionize the way CAD / GIS users create and collaborate. Integrating Google Maps into Project Butterfly is just one of those new capabilities and possibilities an online CAD platform such as ours can offer.

The integration of Google Maps became possible due to Google Maps API for Flash. Flash is the platform behind Project Butterfly’s client as Jonathan Seroussi recently wrote about in his blog post.

In this post I will provide some technical information regarding the implementation and use of Project Butterfly with Google maps.

We chose Google Maps over other map providers because it has the most comprehensive and documented API, as well as an active community. Having said that, we’ve designed the feature with the flexibility that would allow us to switch to a different map provider easily, if we ever find a service that provides a better map experience.

When you turn on Google Maps, Butterfly places a map under your model. After you place your drawing on a certain location, Butterfly saves that position. The next time you turn on the map, it will return to that location.

Once a map has been underlaid, it moves in sync with your drawing. To achieve this sync we had to strip Google Maps from all of its controls, keyboard hooks and mouse events so we will be in full control on the panning and zooming. This enables you to keep using our zoom slider, buttons, zoom window, etc.

To enable contextual search we used Google Geocoding API to transform your text queries into coordinates on the map. We even match the appropriate zoom level to your location. Searching for Asia will give a full view of the continent whereas searching for “Golden Gate Bridge” will allow you to almost touch the suspenders.

Many users are probably wondering how the widget enables move and scale of entire drawings, whereas the box selection of Project Butterfly only allows selection of 30 objects at a time. This is made possible do to a trick we do. Moving or scaling the drawing in place drawing mode doesn’t actually changes anything in the drawing. It is simply a mix of viewports changing that creates the illusion that we are scaling and moving the entire drawing.

The “2 points” mechanism allows you to place your model very easily. With 2 points you mark two corresponding lines – one on the map and one on the model. Butterfly then calculates the scale, rotation angle and the distance between the two lines and overlays them one on the other.

We hope you will enjoy this latest addition to our features list.

Chen Harel,
Sr Software Engineer



  1. Eran Harel
    Posted April 8, 2010 at 3:45 AM | Permalink

    That’s an amazing story 🙂
    Project Butterfly – Love the name

  2. Dr. Idanrl
    Posted April 9, 2010 at 3:59 AM | Permalink

    It is very good and professional to have some one like you to understand the needs we have,

    Thank you chen for your time and we are waiting for more in the near future.

  3. Laura Bowne
    Posted May 20, 2010 at 9:29 AM | Permalink

    If i bring an AutoCAD Map 2010 DWG in, how can i get it to georeference automatically with the google display?

    Thanks, Project Butteryfly has lots of potential !

    • Butterfly
      Posted May 22, 2010 at 11:22 PM | Permalink

      Hi, Laura. Project Butterfly doesn’t automatically place the drawing on the map. It’s a manual process.

      Thanks for your kind words.

Post a Comment

Required fields are marked *


%d bloggers like this: