R2i DotNetNuke Blog

 

Google Map Module and Open Web Studio

Friday, June 18, 2010 by Kateryna Sytnyk

First of all, here are a few resources  you may find useful when using Google Map module:

Google Map Downloads:

Module download: http://www.dotnetnuke.com/Products/Development/Forge/ModuleMap/Downloads/tabid/968/Default.aspx

Get Google Map license key: http://code.google.com/apis/maps/signup.html

Google Map tutorials:

PDF user guide: http://www.dotnetnuke.com/LinkClick.aspx?fileticket=wX7EgjU7bg0%3d&tabid=968&mid=3231

Video tutorial: http://www.dotnetnuke.com/LinkClick.aspx?fileticket=4Y4sWfTNHvE%3d&tabid=968&mid=3232

Google Map and Open Web Studio Integration

Example 1

Say, you have a list of distributor centers located in different states. You need to display centers on the map based on the state. So, in the Map module you will use a Custom Query as a datasource:

select * from Map_points
where Address like '% ' + @State + ' %'
where @State is a form Variable: Type: Form Source: frmState Target: @State Modify the Search Template: When the value is selected from the drop down, it gets stored in the hidden field on the form ("hidden_state" in this example ). Make sure you set "Textbox Element ID" in the Google Maps module to "hidden_state". Finally, here is a code snippet that you would use for a Search Template:

Custom Query as a datasource

Example 2

Here is a search template for entering zip code in a text field, implemented with OWS Search Template:

find location code

Make sure you add the following style to the google map container:

CSS for find location

In some cases the images on the map appear blank, because they are affected by main styling on the page.

Importing Data in Map_Points Table

In some projects there is a requirement to make some entities list searchable in the Google Map module. This can be achieved by importing the locations along with entity descriptions to Map_Points table. Often times, entity information comes in Excel spreadsheet. It needs to be imported in the database via Import Wizard. Then the configuration should be modified accordingly. The module can be placed on any page and deleted after importing is completed. The complete source for the import configuration is attached. Here's the query used in the example:

importing data

 
Comments

2500 characters remaining

Add Comment
 

Most Discussed

 

Subscribe to our blog

 

Send Us a Note





Send

 
 

New York, NY • Baltimore, MD • Vienna, VA • St. Louis, MO • Seatle, WA • 410.327.0007 • info@R2Integrated.com

Bookmark & Share Bookmark and Share