Jump to content

how to make a google map on my website


cmabill

Recommended Posts

how to insert google map on website

 

 

 

I want to use below code for my google map, which is posted on internet and easy to understand, but it doesn't works. I hae get API key but when I replace the original key, I don't know which part of code I need to modified. how to get a GLatlng cooridinates cooresponding with my API key.

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     
  2. "http://www.w3.org/TR...tml1-strict.dtd">
     
  3. <html xmlns="http://www.w3.org/1999/xhtml">
     
  4. <head>
     
  5. <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
     
  6. <title>Google Maps Javascript API Example</title>
     
  7. <script src="http://maps.google.c...v=2&key=abcdefg"
     
  8. type="text/javascript"></script>
     
  9. <script type="text/javascript">
     
  10. //<![CDATA[
     
  11. function load() {
     
  12. if (GBrowserIsCompatible()) {
     
  13. var map = new GMap2(document.getElementById("map"));
     
  14. map.setCenter(new GLatLng(37.4419, -122.1419), 13);
     
  15. }
     
  16. }
     
  17. //]]>
     
  18. </script>
     
  19. </head>
     
  20. <body onload="load()" onunload="GUnload()">
     
  21. <div id="map" style="width: 500px; height: 300px"></div>
     
  22. </body>
     
  23. </html>

I think I only need to replace this two parts in red color, is there any more place that I should modified.

 

I think this is the simple way that I could use google map on my website. pls come up with better ways if you could. thanks.

Link to comment
https://forums.phpfreaks.com/topic/272995-how-to-make-a-google-map-on-my-website/
Share on other sites

anyone help me identify this code is for V2 or V3.

 

<!DOCTYPE html>

<html>

<head>

<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

<style type="text/css">

html { height: 100% }

body { height: 100%; margin: 0; padding: 0 }

#map_canvas { height: 100% }

</style>

<script type="text/javascript"

src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=SET_TO_TRUE_OR_FALSE">

</script>

<script type="text/javascript">

function initialize() {

var mapOptions = {

center: new google.maps.LatLng(-34.397, 150.644),

zoom: 8,

mapTypeId: google.maps.MapTypeId.ROADMAP

};

var map = new google.maps.Map(document.getElementById("map_canvas"),

mapOptions);

}

</script>

</head>

<body onload="initialize()">

<div id="map_canvas" style="width:100%; height:100%"></div>

</body>

</html>

 

here is the link from google thank you for your help.

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.