Google Maps API C# Codebehind or Java Pass Variables?

Posted on 2009-02-08
Last Modified: 2012-05-06
I have the follow simple code for an .html Google map, but I program .aspx pages. Also need to pass several variables to the script somehow from a database.

Q. Is Google Maps API stictly Javascript?

Q. Is there a way to codebehind the Javascript?

Q. How do I pass dynamic coords to the Javascript or codebehind?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"


<html xmlns="">


    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>

    <title>Google Maps JavaScript API Example</title>

    <script src=";v=2&amp;key=ABCDEFG"



<body onunload="GUnload()">

    <!-- you can use tables or divs for the overall layout -->

    <table border="1">



           <div id="map" style="width: 500px; height: 400px"></div>


        <td width="150" valign="top" style="text-decoration: underline; color: #4444ff;">

           <div id="side_bar"></div>




    <script type="text/javascript">

        if (GBrowserIsCompatible()) {

            // this variable will collect the html which will eventually be placed

            // in the side_bar

            var side_bar_html = "";

            // arrays to hold copies of the markers and html used by the side_bar

            // because the function closure trick doesnt work there

            var gmarkers = [];

            var i = 0;

            var lastlinkid;

            // A function to create the marker and set up the event window

            function createMarker(point, name, html) {

                var marker = new GMarker(point);

                var linkid = "link" + i;

                GEvent.addListener(marker, "click", function() {


                    document.getElementById(linkid).style.background = "#ffff00";

                    lastlinkid = linkid;


                // save the info we need to use later for the side_bar

                gmarkers[i] = marker;

                // add a line to the side_bar html

                side_bar_html += '<div id="' + linkid + '"><a href="javascript:Linkclicked(' + i + ')">'

           + name + '</a><br></div>';


                return marker;


            // This function picks up the click and opens the corresponding info window

            function Linkclicked(i) {

                GEvent.trigger(gmarkers[i], "click");


            // create the map

            var map = new GMap2(document.getElementById("map"));

            map.addControl(new GLargeMapControl());

            map.addControl(new GMapTypeControl());

            map.setCenter(new GLatLng(43.907787, -79.359741), 8);

            var mm = new GMarkerManager(map);

            // add the points    

            var point = new GLatLng(43.65654, -79.90138);

            var marker = createMarker(point, "This place", "This is The First Info")

            var point = new GLatLng(43.91892, -78.89231);

            var marker = createMarker(point, "That place", "This is The Second Info")

            var point = new GLatLng(43.82589, -78.89231);

            var marker = createMarker(point, "The other place", "This is The Third Info")

            GEvent.addListener(map, "infowindowclose", function() {

                document.getElementById(lastlinkid).style.background = "#ffffff";


            mm.addMarkers(gmarkers, 0, 17);


            // put the assembled side_bar_html contents into the side_bar div

            document.getElementById("side_bar").innerHTML = side_bar_html;


        else {

            alert("Sorry, the Google Maps API is not compatible with this browser");





Open in new window

Question by:pointeman
    LVL 29

    Accepted Solution

    Hi pointeman,
    You can use Google map .net control to resolve the entire problems that you've raised up here.

    Alternative control : GMapDotNetControl

    If you want to build your own custom control using the existing Google map html source code that mentioned above, you need to build everything from the scratch. I've come across with similiar question before, you can check it here regarding how you can pass the variables from database to google map HTML source code dynamically. It is written in format. You can convert it to C# format based on your live situation.
    Hope that helps.
    LVL 29

    Expert Comment

    by:David H.H.Lee
    This is PAQ that i mentioned (as a starter for your question):

    Author Comment

    I'll try the GMapDotNetControl and let you know .... thanks

    Author Comment

    I downloaded the GMapDotNetControl and opened it in both VS2005 and VS2008, but I only see a large gray area on default.aspx page when trying to run the project...

    Featured Post

    What Security Threats Are You Missing?

    Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

    Join & Write a Comment

    Just a quick little trick I learned recently.  Now that I'm using jQuery with abandon in my applications, I have grown tired of the following syntax:      (CODE) I suppose it just offends my sense of decency to put inline VBScript on a…
    In this Article, I will provide a few tips in problem and solution manner. Opening an ASPX page in Visual studio 2003 is very slow. To make it fast, please do follow below steps:   Open the Solution/Project. Right click the ASPX file to b…
    This video discusses moving either the default database or any database to a new volume.
    Here's a very brief overview of the methods PRTG Network Monitor ( offers for monitoring bandwidth, to help you decide which methods you´d like to investigate in more detail.  The methods are covered in more detail in o…

    734 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    21 Experts available now in Live!

    Get 1:1 Help Now