473,715 Members | 2,766 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Google Map that uses an XML file to create markers

2 New Member
Hello,

I work for a non-profit in San Diego as a GIS Specialist. I have had to teach myself about some scripting to create some dynamic maps, but I am still very limited in my skills, so I have had to explore the internet in order to discover various tutorials and examples that have led me on a positive path.

Right now I am working on a Google Mash-Up that will incorporate over 14,000 records, which will appear as separate markers that will have pop-up info bubbles with additional info inside (using html), once the marker is clicked.

Here is the XML script example that is used in the tutorial I am following:

<markers>
<marker lat="43.65654" lng="-79.90138" html="Some stuff to display in the&lt;br&gt;Fi rst Info Window"
label="Marker One" />
<marker lat="43.91892" lng="-78.89231" html="Some stuff to display in the&lt;br&gt;Se cond Info Window"
label="Marker Two" />
<marker lat="43.82589" lng="-79.10040" html="Some stuff to display in the&lt;br&gt;Th ird Info Window"
label="Marker Three" />
</markers>

...and this is how it looks when the file is retrieved by the java script and mapped: http://econym.googlepa ges.com/example_map3.ht m

This is the java script that creates the Google Map. I have emboldened the section of the script that retrieves the data and parses it to create the markers:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Google Maps</title>
<script src="http://maps.google.com/maps?file=api&a mp;v=2&amp;key= ABQIAAAA6GoL8P5 zqjQlG5A5uM1ETB SUPozAscB0cY3RG 8xEGnZyeom4axRy Sak889rVpvHYRsV 4f9OZZzbboA"
type="text/javascript"></script>
</head>
<body onunload="GUnlo ad()">

<!-- you can use tables or divs for the overall layout -->
<table border=1>
<tr>
<td>
<div id="map" style="width: 800px; height: 1200px"></div>
</td>
<td width = 200 valign="top" style="text-decoration: underline; color: #4444ff;">
<div id="side_bar"> </div>
</td>
</tr>
</table>


<noscript><b>Ja vaScript must be enabled in order for you to use Google Maps.</b>
However, it seems JavaScript is either disabled or not supported by your browser.
To view Google Maps, enable JavaScript by changing your browser options, and then
try again.
</noscript>


<script type="text/javascript">
//<![CDATA[

if (GBrowserIsComp atible()) {
// this variable will collect the html which will eventualkly be placed in the side_bar
var side_bar_html = "";

// arrays to hold copies of the markers used by the side_bar
// because the function closure trick doesnt work there
var gmarkers = [];
var i = 0;


// A function to create the marker and set up the event window
function createMarker(po int,name,html) {
var marker = new GMarker(point);
GEvent.addListe ner(marker, "click", function() {
marker.openInfo WindowHtml(html );
});
// 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 += '<a href="javascrip t:myclick(' + i + ')">' + name + '</a><br>';
i++;
return marker;
}


// This function picks up the click and opens the corresponding info window
function myclick(i) {
GEvent.trigger( gmarkers[i], "click");
}


// create the map
var map = new GMap2(document. getElementById( "map"));
map.addControl( new GLargeMapContro l());
map.addControl( new GMapTypeControl ());
map.setCenter(n ew GLatLng( 37.251699,-119.604315), 7);


*// Read the data from testXML2blackpo olformat.xml*
*var request = GXmlHttp.create ();*
*request.open(" GET", "testXML2blackp oolformat.xml", true);*
*request.onread ystatechange = function() {*
*if (request.readyS tate == 4) {*
*var xmlDoc = GXml.parse(requ est.responseTex t);*
*// obtain the array of markers and loop through it*
*var markers = xmlDoc.document Element.getElem entsByTagName(" ConnectoryRecor d");*

for (var i = 0; i < markers.length; i++) {
// obtain the attribues of each marker
var lat = parseFloat(mark ers[i].getAttribute(" lat"));
var lng = parseFloat(mark ers[i].getAttribute(" lng"));
var point = new GLatLng(lat,lng );
var html = markers[i].getAttribute(" html");
var label = markers[i].getAttribute(" label");
// create the marker
var marker = createMarker(po int,label,html) ;
map.addOverlay( marker);
}

// put the assembled side_bar_html contents into the side_bar div
document.getEle mentById("side_ bar").innerHTM L = side_bar_html;
}
}
request.send(nu ll);
}

else {
alert("Sorry, the Google Maps API is not compatible with this browser");
}
// This Javascript is based on code provided by the
// Blackpool Community Church Javascript Team
// http://www.commchurch. freeserve.co.uk/
// http://econym.googlepa ges.com/index.htm

//]]>
</script>
</body>

</html>

Here is my delima--
This is the xml format that I need to use because it can accept the rest of my excel file and loop it through the 14,000+ records to create a functioning xml file. This is just a sample (2 records) of the larger file:

<?xml version="1.0" encoding="UTF-8" standalone="yes " ?>
<ConnectoryAug2 008>
<ConnectoryReco rd>
<lng>-117.03683</lng>
<lat>32.94450 5</lat>
<ConnectoryID>1 </ConnectoryID>
<Name>$2.95 Guys</Name>
<StreetAddress> 13750 Stowe Drive</StreetAddress>
<City>Poway</City>
<State>CA</State>
<Zip>92064</Zip>
<Marker>White </Marker>
<IndustryGroup> Technical Services</IndustryGroup>
<ConnectoryProf ileLink>http://connectory.com/search/profile_view.as px?connectoryId =1</ConnectoryProfi leLink>
</ConnectoryRecor d>
<ConnectoryReco rd>
<lng>-117.272843</lng>
<lat>33.13337 </lat>
<ConnectoryID>2 </ConnectoryID>
<Name>(GLDS) Great Lakes Data Systems</Name>
<StreetAddress> 5954 Priestly Drive</StreetAddress>
<City>Carlsba d</City>
<State>CA</State>
<Zip>92008</Zip>
<Marker>Orang e</Marker>
<IndustryGroup> Technology</IndustryGroup>
<ConnectoryProf ileLink>http://connectory.com/search/profile_view.as px?connectoryId =2</ConnectoryProfi leLink>
</ConnectoryRecor d>
</ConnectoryAug20 08>

This is the tutorial where I found the formatting techniques to successfully create the large xml file that will format/convert my excel file properly: http://www.mrexcel.com/tip064.shtml

These variables should appear as html in the info bubble:

<ConnectoryID>2 </ConnectoryID>
<Name>(GLDS) Great Lakes Data Systems</Name>
<StreetAddress> 5954 Priestly Drive</StreetAddress>
<City>Carlsba d</City>
<State>CA</State>
<Zip>92008</Zip>
<IndustryGroup> Technology</IndustryGroup>
<ConnectoryProf ileLink>http://connectory.com/search/profile_view.as px?connectoryId =2</ConnectoryProfi leLink>

The "Marker" variable instructs Google Maps to label the marker with a particular color. I will be so grateful to the person(s) that helps me get through this wall that I have been hitting for a long time. It's very difficult without having the luxury of peers who know about these types of issues.

Thank you!!
Aug 19 '08 #1
0 3737

Sign in to post your reply or Sign up for a free account.

Similar topics

1
3717
by: mich dobelman | last post by:
What's the common way to integrate php and google map api? I tried to create the getShop.php script which access the db and fetch the list of shops with lat and lon information in xml document. But without access? I thought this is not the common way to call the php script from javascript? any advice appreciated.
0
1145
by: hybrid_snyper | last post by:
Hi all, wondering if someone can help me. im working on some tutorials for using googlemaps. Currently im working on using sql databases and php to store and retreive markers. Im very impressed with what is possible and looking to learn a bit more. However the book im working fails to expand on the php amd doesnt help answer any of my questions. i have a php page that lets me store markers to the database, i would like to manipulate...
3
9617
by: Lemon Tree | last post by:
Hi everybody. I am new to Javascript so probably I am asking something trivial, but I cannot see where there problem is. Or, better. Maybe I know where the problem is but I cannot find a solution. So, here we go... I have loaded an XML document containing a bunch of addresses. For each address I would like to put a marker on a map using the Google Maps API. In order to do so, I iterate over the address tags in the XML
1
3848
by: sacksey | last post by:
Hi. I've been trying to play with this for a while now but I haven't seemed to get it to work. I have a admin controller, which is scaffolded, to input the lat and long along with info. I have a restaurant controller that will display the map with the points. I can get the map to show but the points do not show. class CreateRestaurants < ActiveRecord::Migration def self.up create_table :restaurants do |t| t.column...
0
1505
by: joaorbraposo | last post by:
Hi! I'm creating an application using C# and I need to display one or more markers in a webBrowser object using Google Maps. The problem is that I was thinking to create only one HTML file that I could change automatically everytime I need to display something. Like this I need to edit this file with the right code (HTML and JavaScript) and than open it in the webBrowser object. This file would be located on local disk and not on a...
1
1822
by: SyPhy | last post by:
Hi all, First post to this group and I hope I can get some help. I have been stuck on this all day.... I am using the Google Maps API to plot markers grouped into categories via checkboxes. Some categories of markers are to load when the page loads, which are contained in a single XML file, other categories are to load after the user toggles the checkbox associated with a group of markers on.
4
1429
by: iceanfire | last post by:
On the backend I have a python script that gets two pieces of information from the database: 1. html 2. xml file The javascript is supposed to : 1. inject the html file into a div 2. use the xml file to create markers on google maps I want to avoid multiple calls to the database, so I was wondering, if
5
2938
by: Nike1984 | last post by:
I'm fairly new to Javascript and it's more of a guessing game for me... I'm trying to build an app for Google Maps and just had some issues recently. First off I just wanted to say that everything works fine in FF and IE. It's Chrome I'm having issues with. I understand that Chrome is still somewhat in beta stages, so some bugs might occur. However this seems like something I might have done. So... I used a code that I found on Econym as...
0
9343
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
9198
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
1
9104
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
9047
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
7973
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
6646
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
4477
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
0
4738
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
3
2119
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.