How do i implement Google Maps into my Loop?

programming
1

Hi guys - I have a comapany listing page which the user can do a
search for companies by city in the gta, ontario canada.

The thing is how do i implement the following code:

<!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> 
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/ 




    <title>Google Maps JavaScript API Example</title> 
    <script src="http://maps.google.com/maps? mykey goes here 
&sensor=true" 
      type="text/javascript"></script> 
    <script type="text/javascript"> 

    //<![CDATA[ 
    function load() { 
      if (GBrowserIsCompatible()) { 
        var map = new GMap2(document.getElementById("map")); 
        map.setCenter(new GLatLng(43.5658865,-79.7006233), 15); // (up/ 
down- lower=down, left/right-lower is left), larger for zoom) 


>-79.5921458,43.5494699 


                var marker = new GMarker(new GLatLng(43.5658865,-79.7006233)); 
                map.addOverlay(marker); 
      } 
    } 

    //]]> 
    </script> 
  </head> 
  <body onload="load()" onunload="GUnload()"> 
    <div id="map" style="width:400px;height:250px"></div> 
  </body> 
</html>

INTO my page that dynamically pulls all the locations from a database?
i actually entered this code into the database field called “Map” changing only the co-ordinates
for each location – however only the first
business lisiting has the map pop up. I know it has to be because
this code is starting and terminating with head, body and html tags.
what is the correct way of doing this?
(i am new to coding - forgive me!)