谷歌地图JS API V3 addMarker - 标记在源代码中被回应,没有地图

时间:2016-01-12 23:52:11

标签: javascript php mysql google-maps google-maps-api-3

下面的代码应该生成一个谷歌地图并从MySQL数据库中检索标记并在地图上绘制它们。相反,我得到一个没有错误的空白页面,当查看源代码时,所有addMarker点都在那里回显。我究竟做错了什么?我尝试将最终的php db查询部分移动到JS部分的外部,最终将addMarker db结果回显到实际页面,而不仅仅是在源中可见。

    <?php
$dbname            ='edited out'; //Name of the database
$dbuser            ='edited out'; //Username for the db
$dbpass            ='edited out'; //Password for the db
$dbserver          ='edited out'; //Name of the mysql server

$dbcnx = mysql_connect ("$dbserver", "$dbuser", "$dbpass");
mysql_select_db("$dbname") or die(mysql_error());
?>
<html>
 <head>
 <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
 <title>Stott Outdoor Advertising Experimental Inventory Map - SQL Version</title>
<style>
   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=edited out">
    </script>
 <script type="text/javascript">
 var icon = new google.maps.MarkerImage("edited out/gmaps/Bulletin-sm.png",
 new google.maps.Size(32, 32), new google.maps.Point(39.729468, -121.847099),
 new google.maps.Point(16, 32));
 var center = null;
 var map = null;
 var currentPopup;
 var bounds = new google.maps.LatLngBounds();
 function addMarker(lat, lng, info) {
 var pt = new google.maps.LatLng(lat, lng);
 bounds.extend(pt);
 var marker = new google.maps.Marker({
 position: pt,
 icon: icon,
 map: map
 });
 var popup = new google.maps.InfoWindow({
 content: info,
 maxWidth: 300
 });
 google.maps.event.addListener(marker, "click", function() {
 if (currentPopup != null) {
 currentPopup.close();
 currentPopup = null;
 }
 popup.open(map, marker);
 currentPopup = popup;
 });
 google.maps.event.addListener(popup, "closeclick", function() {
 map.panTo(center);
 currentPopup = null;
 });
 }
 function initMap() {
 map = new google.maps.Map(document.getElementById("map"), {
 center: new google.maps.LatLng(0, 0),
 zoom: 14,
 mapTypeId: google.maps.MapTypeId.ROADMAP,
 mapTypeControl: false,
 mapTypeControlOptions: {
 style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR
 },
 navigationControl: true,
 navigationControlOptions: {
 style: google.maps.NavigationControlStyle.SMALL
 }
 });
 <? php
 $query = mysql_query("SELECT * FROM edited out");
 while ($row = mysql_fetch_array($query)){
 $name=$row['name'];
 $lat=$row['lat'];
 $lon=$row['lon'];
 $desc=$row['desc'];
 echo ("addMarker($lat, $lon,'<b>$name</b><br/>$desc');\n");
 }
 ?>
 center = bounds.getCenter();
 map.fitBounds(bounds);

 }
 </script>
 </head>
 <body onload="initMap()" style="margin:0px; border:0px; padding:0px;">
 <div id="map"></div>
 </html>

更新:根据@gegillam,我向google.maps.size添加了坐标而不是0,0。不幸的是,地图仍未显示。根据@geocodezip,以下是浏览器看到的内容:

<html>
 <head>
 <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
 <title>Stott Outdoor Advertising Experimental Inventory Map - SQL Version</title>
<style>
   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=edited out">
    </script>
 <script type="text/javascript">
 var icon = new google.maps.MarkerImage("edited out/gmaps/Bulletin-sm.png",
 new google.maps.Size(32, 32), new google.maps.Point(39.729468, -121.847099),
 new google.maps.Point(16, 32));
 var center = null;
 var map = null;
 var currentPopup;
 var bounds = new google.maps.LatLngBounds();
 function addMarker(lat, lng, info) {
 var pt = new google.maps.LatLng(lat, lng);
 bounds.extend(pt);
 var marker = new google.maps.Marker({
 position: pt,
 icon: icon,
 map: map
 });
 var popup = new google.maps.InfoWindow({
 content: info,
 maxWidth: 300
 });
 google.maps.event.addListener(marker, "click", function() {
 if (currentPopup != null) {
 currentPopup.close();
 currentPopup = null;
 }
 popup.open(map, marker);
 currentPopup = popup;
 });
 google.maps.event.addListener(popup, "closeclick", function() {
 map.panTo(center);
 currentPopup = null;
 });
 }
 function initMap() {
 map = new google.maps.Map(document.getElementById("map"), {
 center: new google.maps.LatLng(0, 0),
 zoom: 14,
 mapTypeId: google.maps.MapTypeId.ROADMAP,
 mapTypeControl: false,
 mapTypeControlOptions: {
 style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR
 },
 navigationControl: true,
 navigationControlOptions: {
 style: google.maps.NavigationControlStyle.SMALL
 }
 });

 center = bounds.getCenter();
 map.fitBounds(bounds);
  addMarker(41.953133, -124.204185,'<b>2</b><br/>West Side of Hwy 101, 700ft north of Mouth of Smith River Rd');
addMarker(38.162266, -121.26223,'<b>3</b><br/>West Side of Hwy 99, 740ft north of Woodbridge Rd');
addMarker(36.31665, -119.685837,'<b>4</b><br/>North Side of Hwy 198, 2160ft east of 13th Ave Overpass');
addMarker(41.580868, -124.078964,'<b>5</b><br/>West Side of Hwy 101, 20ft north of Lonesome Rd');
addMarker(35.990166, -119.299202,'<b>6</b><br/>West Side of Hwy 99, 1.2 miles south of Ave 120');
addMarker(39.186417, -123.211037,'<b>7</b><br/>East Side of Hwy 101, 1800ft south of Lake Mendocino Dr');
addMarker(39.465332, -121.576866,'<b>8</b><br/>East Side of Hwy 70, 700ft north of Ophir Rd');
addMarker(35.213516, -119.011452,'<b>102</b><br/>West Side of Hwy 99, 1800ft north of Bear Mountain Rd (south of Bakersfield)');
addMarker(39.686066, -122.207436,'<b>103</b><br/>West Side of I-5, 2000ft north of Road 27');
addMarker(39.334435, -121.68335,'<b>201</b><br/>West Side of Hwy 99, 50ft north of Evans Reimer Rd');
addMarker(39.028534, -122.920418,'<b>202</b><br/>East Side of Hwy 29, south of Todd Road Exit');
addMarker(40.421417, -122.282799,'<b>203</b><br/>West Side of I-5, 1.1 miles south of Deschutes Rd Overcrossing');
addMarker(39.341816, -123.315987,'<b>204</b><br/>West Side of Hwy 101, 950ft north of Black Bart Dr (south of Willits)');
addMarker(39.423569, -119.205521,'<b>205</b><br/>North Side of Hwy 50, 800ft west of Orange Ln (1 mile east of Silver Springs)');
addMarker(37.008484, -120.11483,'<b>206</b><br/>East Side of Hwy 99, 1 mile south of Avenue 18 1/2 Overpass (north of Madera)');
addMarker(40.424519, -122.283279,'<b>207</b><br/>West Side of I-5, .9 miles south of Deschutes Rd');
addMarker(39.478851, -122.192535,'<b>208</b><br/>East Side of I-5, 1 mile south of Road 57 Interchange');
addMarker(39.339268, -123.31292,'<b>301</b><br/>West Side of Hwy 101, 350ft south of Blackbart Drive');
addMarker(39.356049, -122.192451,'<b>303</b><br/>East Side of I-5, 2650ft north of Delevan Overcrossing');
addMarker(35.990368, -119.959366,'<b>304</b><br/>East Side of Hwy 41, 800ft north of Bernard Dr');
addMarker(39.4202, -123.35508,'<b>305</b><br/>West Side of Hwy 101, 600ft north of Casteel Ln');
addMarker(40.687, -122.345932,'<b>306</b><br/>East Side of I-5, 1450ft north of Union School Rd');
addMarker(41.947834, -124.196533,'<b>307</b><br/>East Side of Hwy 101, 360ft south of Salmon Harbor Rd');
addMarker(35.737118, -119.241386,'<b>308</b><br/>West Side of Hwy 99, 3500ft south of Woollomes Ave');
addMarker(39.378681, -123.339813,'<b>309</b><br/>West Side of Hwy 101, 970ft north of south turn off to Hollands Ln');
addMarker(37.339149, -120.5868,'<b>310</b><br/>East Side of Hwy 99, 2050ft south of East Atwater Overpass');
addMarker(99.554001, -119.26915,'<b>402</b><br/>South Side of I-80, 1150ft west of West Fernley Interchange #46');
addMarker(38.111649, -121.258499,'<b>403</b><br/>East Side of Hwy 99, 1650ft south of Kettleman Lane');
addMarker(39.781319, -121.882286,'<b>404</b><br/>West Side of Hwy 99, 1/4 mile north of Eaton Rd');
addMarker(35.990719, -119.298386,'<b>405</b><br/>East Side of Hwy 99, .88 miles north of Ave 104');
addMarker(39.175781, -121.988716,'<b>406</b><br/>North Side of Hwy 20, 1200ft west of Niagra');
addMarker(39.190132, -121.99688,'<b>407</b><br/>North Side of Hwy 20, 435ft west of Sunrise Blvd.');
addMarker(35.956818, -119.053215,'<b>409</b><br/>East Side of Hwy 65, 1975ft south of Avenue 95');
addMarker(41.6833, -122.632668,'<b>501</b><br/>East Side of I-5, 1 mile south of Yreka');
addMarker(41.93475, -124.169014,'<b>502</b><br/>East Side of Hwy 101, 600ft north of Ocean View Drive');
addMarker(41.952251, -124.203133,'<b>503</b><br/>East Side of Hwy 101, 200ft north of Mouth of Smith River Road');
addMarker(41.95155, -124.202187,'<b>504</b><br/>East Side of Hwy 101, 200ft south of Mouth of Smith River Road');
addMarker(38.768417, -120.44622,'<b>505</b><br/>South Side of Hwy 50, 440ft east of Ice House Road');
addMarker(40.908699, -124.088486,'<b>507</b><br/>East Side of Hwy 101, 1600ft north of Giuntoli Lane');
addMarker(35.955933, -119.053284,'<b>508</b><br/>East Side of Hwy 65, 2300ft south of Avenue 95');
addMarker(41.747551, -124.178818,'<b>601</b><br/>West Side of Hwy 101, 90ft south of Neptune');
addMarker(40.484001, -122.350983,'<b>603</b><br/>West Side of Hwy 273, 900ft north of Overland Drive');
addMarker(40.94685, -117.488518,'<b>604</b><br/>North Side of I-80, 750ft east of Golconda Overcrossing at MP 30.58');
addMarker(40.280418, -120.487129,'<b>605</b><br/>East Side of Hwy 395, 1570ft south of County Rd A-3 (9 miles south of Susanville)');
addMarker(39.026199, -123.137497,'<b>606</b><br/>East Side of Hwy 101, 1320ft north of Largo Rd (Approx 6 miles south of Ukiah)');
addMarker(39.268017, -123.233482,'<b>607</b><br/>East Side of Hwy 101, 3800ft north of West Road');
addMarker(41.431019, -122.389069,'<b>701</b><br/>West Side of Hwy 97, 200ft north of Alamo Avenue');
addMarker(41.471985, -122.351349,'<b>702</b><br/>East Side of Hwy 97, 200ft south of Big Springs Road');
addMarker(41.472832, -122.351135,'<b>703</b><br/>East Side of Hwy 97, 100ft north of Big Springs Road');
addMarker(41.473618, -122.350784,'<b>704</b><br/>East Side of Hwy 97, 420ft north of Big Springs Road');
addMarker(41.474533, -122.350464,'<b>705</b><br/>East Side of Hwy 97, 800ft north of Big Springs Road');
addMarker(41.967232, -121.914146,'<b>706</b><br/>East Side of Hwy 97, 400ft north of Railroad Avenue');
addMarker(41.967182, -121.912933,'<b>707</b><br/>East Side of Hwy 97, 670ft north of Railroad Avenue');
addMarker(41.967201, -121.912514,'<b>708</b><br/>East Side of Hwy 97, 1100ft north of Railroad Avenue');
addMarker(41.967251, -121.912033,'<b>709</b><br/>East Side of Hwy 97, 1260ft north of Railroad Avenue');
addMarker(41.494999, -120.583153,'<b>710</b><br/>North Side of Hwy 299, 2 miles west of Alturas');
addMarker(41.494934, -120.580902,'<b>711</b><br/>North Side of Hwy 299, 1.9 miles west of Alturas');
addMarker(41.500015, -120.530266,'<b>712</b><br/>East Side of Hwy 395, .5 miles north of Alturas');
addMarker(40.468334, -122.328247,'<b>713</b><br/>West Side of Hwy 273, 1150ft south of Hill Street');
addMarker(39.747349, -122.17627,'<b>717</b><br/>North Side of Hwy 32, 300ft east of M Street');
addMarker(40.946815, -117.76255,'<b>718</b><br/>North Side of I-80, 1/2 mile west of Winnemucca Exit 176');
addMarker(40.399734, -122.280418,'<b>719</b><br/>East Side of Hwy 273 (Main St), 1175ft north of Trefoil Lane');
addMarker(36.099682, -119.322365,'<b>720</b><br/>East Side of Hwy 99, 1/2 mile south of Tipton Rest Area');
addMarker(33.760799, -116.305229,'<b>721</b><br/>South Side of I-10, .2 miles west of Washington Street Overcrossing');
addMarker(33.917984, -116.773552,'<b>722</b><br/>South Side of I-10, at MP 19.60');
addMarker(35.989265, -119.29805,'<b>723</b><br/>East Side of Hwy 99, .78 miles north of Ave 104');
addMarker(35.823101, -119.258835,'<b>801</b><br/>West Side of Hwy 99, 1300ft north of Avenue 16');
addMarker(38.137466, -121.253502,'<b>802</b><br/>South Side of Hwy 12 (Victor Rd), 220ft west of Cluff Avenue');
addMarker(38.740501, -122.624817,'<b>803</b><br/>East Side of Hwy 29, 1550ft north of Dry Creek cut off (south of Middletown)');
addMarker(39.424782, -123.354301,'<b>804</b><br/>West Side of Hwy 101, 1/2 mile north of Willits City Limits');
addMarker(35.955067, -119.053253,'<b>805</b><br/>East Side of Hwy 65, 2625ft south of Avenue 95');
addMarker(39.536182, -119.796165,'<b>806</b><br/>South Side of I-80, 1/2 mile west of Hwy 395 Interchange');
addMarker(39.469383, -121.575882,'<b>901</b><br/>West Side of Hwy 70, .41 miles north of Ophir Road');
addMarker(39.470798, -121.576149,'<b>902</b><br/>West Side of Hwy 70, .51 miles north of Ophir Road');
addMarker(39.69915, -122.1968,'<b>903</b><br/>West Side of Hwy 99, 850ft north of County Road 25');
addMarker(39.747215, -122.185532,'<b>904</b><br/>South Side of Hwy 32 (Walker Street), 540ft east of East Street');
addMarker(41.49445, -120.578682,'<b>905</b><br/>South Side of Hwy 299, 1.7 miles west of Alturas');
addMarker(39.751049, -121.904831,'<b>906</b><br/>North Side of Hwy 32, 230ft west of Muir Ave');
addMarker(40.402, -122.281502,'<b>907</b><br/>East Side of I-5, 4200ft north of Gas Pointe Road');
addMarker(41.889084, -121.380585,'<b>1001</b><br/>East Side of Hwy 139, 550ft north of County Road 113');
addMarker(41.888569, -121.379753,'<b>1002</b><br/>East Side of Hwy 139, 250ft north of County Road 113');
addMarker(41.865749, -121.341866,'<b>1003</b><br/>East Side of Hwy 139, 800ft north of County Road 140');
addMarker(41.86525, -121.341331,'<b>1004</b><br/>East Side of Hwy 139, 500ft north of County Road 140');
addMarker(39.487385, -118.874718,'<b>1005</b><br/>North Side of Hwy 50, 150ft east of Roberson Lane');
addMarker(36.151951, -119.075165,'<b>1006</b><br/>East Side of Hwy 65, 265ft south of Avenue 200');
addMarker(38.055382, -121.258751,'<b>1007</b><br/>East Side of Hwy 99, .14 miles south of Eight Mile Road');
addMarker(40.723083, -122.324615,'<b>1008</b><br/>East Side of I-5, 3000ft south of Fawndale Overcrossing');
addMarker(39.751919, -121.910202,'<b>1107</b><br/>North Side of Hwy 32, .5 miles east of Meridian');
addMarker(39.751999, -121.909866,'<b>1108</b><br/>North Side of Hwy 32, 1/2  and  25ft east of Meridian');
addMarker(39.703999, -121.770836,'<b>1321</b><br/>North Side of Skyway, .6 miles east of Honey Run Rd');
addMarker(39.714951, -121.805984,'<b>1409</b><br/>North Side of Park Ave, 400ft east of Whitman Ave');
addMarker(39.831718, -121.932518,'<b>1506</b><br/>East Side of Hwy 99, 1 mile south of Cana Hwy');
addMarker(39.808102, -121.912117,'<b>1508</b><br/>East Side of Hwy 99, 750ft south of Anita Rd');
addMarker(39.795898, -121.902031,'<b>1510</b><br/>West Side of Hwy 99, 200ft south of Wilson Landing Rd');
addMarker(39.798817, -121.904053,'<b>1518</b><br/>East Side of Hwy 99, 750ft north of Wilson Landing Rd');
addMarker(39.784569, -121.886253,'<b>1521</b><br/>West Side of Hwy 99, 3/4 mile north of Eaton');
addMarker(39.764584, -121.861771,'<b>1527</b><br/>West Side of Hwy 99, 1/4 mile north of Lassen Ave');
addMarker(39.721432, -121.805031,'<b>1530</b><br/>East Side of Hwy 99, 1500ft south of East 20th St');
addMarker(39.722183, -121.805702,'<b>1537</b><br/>East Side of Hwy 99, 1000ft south of East 20th St');
addMarker(39.704666, -121.789413,'<b>1540</b><br/>East Side of Hwy 99, .2 miles north of Southgate Ln');
addMarker(39.70435, -121.789864,'<b>1546</b><br/>West Side of Hwy 99, .2 miles north of Southgate Ln');
addMarker(39.695969, -121.779068,'<b>1547</b><br/>East Side of Hwy 99, .6 miles south of Southgate Ln');
addMarker(39.696667, -121.77977,'<b>1550</b><br/>East Side of Hwy 99, .5 miles south of Southgate Ln');
addMarker(39.650032, -121.725533,'<b>1551</b><br/>West Side of Hwy 99, .3 miles north of Pentz Rd');
addMarker(39.653, -121.72805,'<b>1552</b><br/>East Side of Hwy 99, 1 mile north of Durham Pentz Rd (10 mile south of Chico)');
addMarker(39.493233, -121.689117,'<b>1554</b><br/>West Side of Hwy 99, at Hwy 162 Junction');
addMarker(39.342949, -121.686699,'<b>1559</b><br/>West Side of Hwy 99, 150ft south of Township Rd');
addMarker(39.324066, -121.679787,'<b>1562</b><br/>West Side of Hwy 99, 150ft north of Turner (2 miles south of Gridley)');
addMarker(39.755466, -121.860229,'<b>1605</b><br/>West Side of Esplanade, 75ft north of White');
addMarker(39.756367, -121.861717,'<b>1717</b><br/>South Side of East Ave, 100ft west of Esplanade');
addMarker(39.751617, -121.630867,'<b>2155</b><br/>North Side of Skyway, 20ft west of Black Olive');
addMarker(39.750351, -121.607552,'<b>2207</b><br/>East Side of Clark, 400ft south of Pearson');
addMarker(39.460716, -121.581413,'<b>3113</b><br/>East Side of Hwy 70, .3 miles south of Ophir Rd');
addMarker(39.481731, -121.575218,'<b>3120</b><br/>East Side of Hwy 70, 1000ft north of GP Way');
addMarker(39.478668, -121.57505,'<b>3123</b><br/>East Side of Hwy 70, 300ft north of GP Way');
addMarker(39.474499, -121.575165,'<b>3131</b><br/>East Side of Hwy 70, 1500ft south of GP Way');
addMarker(39.475418, -121.575134,'<b>3140</b><br/>East Side of Hwy 70, 1250ft south of GP Way');
addMarker(39.519932, -121.572868,'<b>3143</b><br/>West Side of Hwy 70, 200ft north of Grand Ave Overpass');
addMarker(39.49205, -121.574783,'<b>3147</b><br/>East Side of Hwy 70, 2750ft south of Oro Dam Blvd Exit');
addMarker(39.492733, -121.574837,'<b>3155</b><br/>East Side of Hwy 70, 2500ft south of Oro Dam Blvd');
addMarker(39.494133, -121.574883,'<b>3160</b><br/>East Side of Hwy 70, 1500ft south of Oro Dam Blvd Exit');
addMarker(39.093418, -121.540916,'<b>4010</b><br/>Junction Hwy 70 and 65 4 miles south of Marysville');
addMarker(39.17915, -121.626579,'<b>5007</b><br/>East Side of Live Oak Blvd, .7 miles south of Eager Rd (1/2 mile north of Yuba City)');
addMarker(40.371601, -122.283981,'<b>6005</b><br/>East Side of I-5, by Cottonwood Bridge');
addMarker(40.286633, -122.278503,'<b>6010</b><br/>West Side of I-5, on Nine Mile Hill');
addMarker(40.04015, -122.099815,'<b>6015</b><br/>East Side of Hwy 99, at Los Molinos NCL');
addMarker(40.128384, -118.520782,'<b>7001</b><br/>South Side of I-80, 1250ft west of Westfall Rd (3 miles west of Lovelock)');
addMarker(40.12965, -118.521652,'<b>7002</b><br/>North Side of I-80, 1150ft west of Westfall Rd (3 miles west of Lovelock)');
addMarker(40.458267, -118.28495,'<b>7003</b><br/>South Side of I-80, 3200ft west of Rye Patch Exit');
addMarker(40.459801, -118.284798,'<b>7004</b><br/>South Side of I-80, 2600ft west of Rye Patch Exit');
addMarker(40.660282, -118.137367,'<b>7005</b><br/>North Side of I-80, 2600ft east of Imlay Exit');
addMarker(40.660831, -118.13102,'<b>7006</b><br/>South Side of I-80, 4300ft east of Imlay Overcrossing');
addMarker(40.916382, -117.839699,'<b>7011</b><br/>South Side of I-80, 2.28 miles west of West Winnemucca Exit 173');
addMarker(40.916718, -117.837967,'<b>7012</b><br/>South Side of I-80, 2.18 miles west of West Winnemucca Exit 173');
addMarker(40.9174, -117.836365,'<b>7013</b><br/>South Side of I-80, 2.08 miles west of West Winnemucca Exit 173');
addMarker(40.91785, -117.834618,'<b>7014</b><br/>South Side of I-80, 1.9 miles west of West Winnemucca Exit 173');
addMarker(41.155815, -117.686096,'<b>7015</b><br/>West Side of Hwy 95, 3170ft south of Dutch Flat Rd (13 miles north of Winnemucca)');
addMarker(41.156631, -117.685867,'<b>7016</b><br/>West Side of Hwy 95, 3530ft south of Dutch Flat Rd (13 miles north of Winnemucca)');
addMarker(39.4659, -121.548431,'<b>8335</b><br/>North Side of Ophir Rd, 250ft east of Lincoln Blvd');
addMarker(39.510551, -121.487633,'<b>9209</b><br/>North Side of Olive Hwy, 400ft east of Skyline Dr');
addMarker(39.782417, -121.883598,'<b>9210</b><br/>West Side of Hwy 99, .7 miles north of Eaton Rd');
addMarker(40.185883, -122.189102,'<b>9211</b><br/>North Side of Hwy 36 (Antelope Blvd), 330ft east of St. Marys Ave');
addMarker(39.003601, -121.625336,'<b>9214</b><br/>North Side of Tudor Rd, 1500ft east of Hwy 99 and Hwy 113 Junction');
addMarker(39.744099, -121.888336,'<b>9301</b><br/>South Side of Hwy 32, 300ft south of Kennedy');
addMarker(39.105385, -121.634331,'<b>9303</b><br/>East Side of Hwy 99, 1275ft north of Smith Rd');
addMarker(39.100117, -121.634232,'<b>9304</b><br/>East Side of Hwy 99, 665ft north of Bogue Rd');
addMarker(38.903416, -121.543465,'<b>9306</b><br/>West Side of Hwy 70, 120ft south of Palm 1200ft south of E. Nicolaus 4-way stop');
addMarker(39.510784, -121.486748,'<b>9307</b><br/>North Side of Olive Hwy, 700ft east of Skyline Dr');
addMarker(39.503235, -121.527802,'<b>9312</b><br/>South Side of Olive Hwy (Hwy 162), 1275ft east of Foothill Blvd');
addMarker(40.307751, -122.279053,'<b>9314</b><br/>East Side of I-5, 1000ft north of Valley Auction Rd (apprx 9 miles north of Red Bluff)');
addMarker(39.003399, -121.624336,'<b>9315</b><br/>South Side of Tudor Rd, 1600ft east of Hwy 99 and Hwy 113 Junction');
addMarker(40.185532, -122.188431,'<b>9403</b><br/>South Side of Hwy 36 (Antelope Blvd), 525ft east of St. Marys Ave');
addMarker(39.101418, -122.114853,'<b>9405</b><br/>East Side of I-5, 100ft north of Myers Rd (Approx 4 miles south of Williams)');
addMarker(39.148933, -122.138916,'<b>9406</b><br/>East Side of I-5, 2000ft south of E St Exit (Williams Central Exit)');
addMarker(39.171032, -121.984947,'<b>9407</b><br/>South Side of Hwy 20, 600ft east of Niagra');
addMarker(39.288715, -121.665283,'<b>9408</b><br/>West Side of Hwy 99, 1325ft south of Nevada');
addMarker(39.928001, -122.1875,'<b>9411</b><br/>North Side of Solano St (Hwy 99 W), 125ft west of Hoag');
addMarker(39.197132, -122.036331,'<b>9412</b><br/>North Side of Hwy 20, 200ft west of Wilson Ave');
addMarker(39.505066, -121.497818,'<b>9501</b><br/>South Side of Olive Hwy (Hwy 162), 220ft west of Oakvale');
addMarker(39.495701, -122.195099,'<b>9503</b><br/>East Side of I-5, 50ft north of County Road 57');
addMarker(39.022968, -122.916718,'<b>9505</b><br/>East Side of Hwy 29, 4000ft south of Todd Road Exit');
addMarker(38.904083, -122.612617,'<b>9506</b><br/>West Side of Hwy 29, 800ft north of Clayton Creek Rd');
addMarker(39.133781, -122.1362,'<b>9507</b><br/>West Side of I-5, 2000ft north of Husted Rd');
addMarker(39.171932, -121.985802,'<b>9508</b><br/>South Side of Hwy 20, 300ft east of Niagra');
addMarker(39.700066, -121.783485,'<b>9601</b><br/>East Side of Hwy 99, 630ft south of Southgate Ln');
addMarker(40.444599, -122.2892,'<b>9602</b><br/>West Side of I-5, 2600ft north of Deschutes Rd');
addMarker(39.160133, -122.896332,'<b>9603</b><br/>North Side of Hwy 20, 420ft west of Lucerne Rd (apprx 2 miles east of Hwy 29 Junction)');
addMarker(39.112549, -123.195335,'<b>9604</b><br/>East Side of Hwy 101, 200ft north of Treatment Plant Rd');
addMarker(39.182751, -123.211716,'<b>9605</b><br/>East Side of Hwy 101, 3000ft south of Lake Mendocino Dr');
addMarker(39.159569, -122.145203,'<b>9606</b><br/>East Side of I-5, 1000ft north of E St (Business 20) Overcrossing');
addMarker(41.154934, -117.686333,'<b>9607</b><br/>West Side of Hwy 95, 2800ft south of Dutch Flat Rd (13 miles north of Winnemucca)');
addMarker(40.914165, -117.846535,'<b>9608</b><br/>South Side of I-80, 2.67 miles west of West Winnemucca Exit 173');
addMarker(40.913517, -117.848564,'<b>9609</b><br/>South Side of I-80, 2.78 miles west of West Winnemucca Exit 173');
addMarker(39.127384, -122.130569,'<b>9610</b><br/>East Side of I-5, 630ft south of Husted Rd Overpass');
addMarker(39.346401, -121.687881,'<b>9611</b><br/>West Side of Hwy 99, 992ft north of Township Rd');
addMarker(39.196968, -123.20932,'<b>9613</b><br/>East Side of Hwy 101, 580ft south of Parducci Rd');
addMarker(39.266251, -123.23053,'<b>9614</b><br/>East Side of Hwy 101, 2800ft north of West Road');
addMarker(38.557335, -121.676735,'<b>9701</b><br/>North Side of I-80, 3/4 mile east of Mace Rd');
addMarker(38.548916, -121.713997,'<b>9702</b><br/>North Side of I-80, 1 mile west of Mace Rd');
addMarker(39.480831, -118.818367,'<b>9704</b><br/>North Side of Hwy 50, 250ft west of Gummow Dr');
addMarker(38.893131, -122.606621,'<b>9705</b><br/>East Side of Hwy 29, 1650ft north of Spruce Grove Rd');
addMarker(38.907684, -123.055298,'<b>9706</b><br/>East Side of Hwy 101, 6 miles north of Cloverdale');
addMarker(39.434166, -121.604851,'<b>9707</b><br/>East Side of Hwy 70, 200ft north of Palermo Rd');
addMarker(39.435001, -121.604652,'<b>9708</b><br/>East Side of Hwy 70, 500ft north of Palermo Rd');
addMarker(39.184601, -121.993782,'<b>9709</b><br/>North Side of Hwy 20, 175ft east of Farinon Rd (East of Colusa)');
addMarker(39.178398, -121.990265,'<b>9710</b><br/>North Side of Hwy 20, 60ft west of Airport South Gate Rd (East of Colusa)');
addMarker(40.915218, -117.843246,'<b>9711</b><br/>South Side of I-80, 2.48 miles west of West Winnemucca Exit 173');
addMarker(40.915783, -117.841614,'<b>9712</b><br/>South Side of I-80, 2.38 miles west of West Winnemucca Exit 173');
addMarker(38.966148, -122.025665,'<b>9713</b><br/>East Side of I-5, 80ft north of Green Bay Rd');
addMarker(38.967567, -123.115883,'<b>9714</b><br/>West Side of Hwy 101, 900ft south of Mountain House Rd');
addMarker(38.96645, -123.115501,'<b>9715</b><br/>West Side of Hwy 101, 1300ft south of Mountain House Rd');
addMarker(39.748081, -121.897346,'<b>9717</b><br/>North Side of Hwy 32, 160ft west of Regent Ln');
addMarker(39.745018, -121.889984,'<b>9718</b><br/>North Side of Hwy 32, 475ft west of Indigo Ln');
addMarker(39.508083, -121.493301,'<b>9720</b><br/>South Side of Hwy 162 (Olive Hwy), 75ft east of Ward Blvd');
addMarker(39.697567, -122.206047,'<b>9721</b><br/>West Side of I-5, 245ft north of Road 25 (3 miles south of Orland)');
addMarker(40.306316, -122.278984,'<b>9722</b><br/>East Side of I-5, 436ft north of Valley Auction Rd (apprx 9 miles north of Red Bluff)');
addMarker(39.699051, -121.782265,'<b>9723</b><br/>East Side of Hwy 99, 365ft south of Southgate Ct');
addMarker(40.662418, -118.129768,'<b>9801</b><br/>North Side of I-80, 1 mile east of Imlay Overcrossing');
addMarker(40.663868, -118.124519,'<b>9802</b><br/>North Side of I-80, 1.25 miles east of Imlay Exit');
addMarker(41.924084, -124.139633,'<b>9804</b><br/>West Side of Hwy 101, 370ft north of Denny St (south of Smith River)');
addMarker(41.9524, -124.203781,'<b>9805</b><br/>West Side of Hwy 101, 390ft north of Mouth of Smith River Rd');
addMarker(39.4272, -123.357498,'<b>9807</b><br/>West Side of Hwy 101, 1 mile north of Willits City limits');
addMarker(39.614216, -119.226814,'<b>9808</b><br/>North Side of I-80, 2000ft west of East Fernley Exit');
addMarker(40.192833, -118.448067,'<b>9809</b><br/>South Side of I-80, east of Lovelock East Exit MP 19.07');
addMarker(39.697819, -121.78112,'<b>9811</b><br/>East Side of Hwy 99, 185ft south of Southgate Ct');
addMarker(40.950249, -117.494553,'<b>9812</b><br/>North Side of I-80, 1600ft west of Golconda Overcrossing');
addMarker(39.553467, -122.217529,'<b>9901</b><br/>West Side of I-5, 2 miles north of Willows I-5/Hwy 162 Interchange');
addMarker(36.000183, -119.300499,'<b>A042</b><br/>East Side of Hwy 99, 1.4 miles north of Avenue 104');
addMarker(35.651951, -119.221466,'<b>A043</b><br/>West Side of Hwy 99, 1/2 mile north of Whisler Road');
addMarker(35.396015, -119.032051,'<b>A044</b><br/>South Side of Hwy 204, 3/4 mile west of F Street');
addMarker(35.420181, -119.061668,'<b>A045</b><br/>West Side of Hwy 99, 1/2 mile north of Olive Drive');
addMarker(35.339668, -119.033798,'<b>A046</b><br/>North Side of Ming Avenue, 300ft east of Castro Lane');
addMarker(35.383217, -119.072998,'<b>A047</b><br/>South Side of Rosedale Hwy (Hwy 58), 400ft east of Fruitvale');
addMarker(40.425983, -122.282166,'<b>ROB1</b><br/>East Side of I-5, .85 miles south of Deschutes Rd Overcrossing');
addMarker(40.402817, -122.281265,'<b>SOV1</b><br/>East Side of I-5, 5000ft north of Gas Point Rd');
 }
 </script>

 </head>
 <body onload="initMap()" style="margin:0px; border:0px; padding:0px;">
 <div id="map"></div>
 </html>

2 个答案:

答案 0 :(得分:0)

您的地图没有尺寸。你在css中有这个:

#map_canvas { height: 100%; }

然而你的&#34;地图&#34; div有id&#34; map&#34;。那应该是:

#map { height: 100%; }

proof of concept fiddle

代码段

&#13;
&#13;
var icon = new google.maps.MarkerImage("http://maps.google.com/mapfiles/ms/micons/blue.png",
  new google.maps.Size(32, 32), new google.maps.Point(0, 0),
  new google.maps.Point(16, 32));
var center = null;
var map = null;
var currentPopup;
var bounds = new google.maps.LatLngBounds();

function addMarker(lat, lng, info) {
  var pt = new google.maps.LatLng(lat, lng);
  bounds.extend(pt);
  var marker = new google.maps.Marker({
    position: pt,
    icon: icon,
    map: map
  });
  var popup = new google.maps.InfoWindow({
    content: info,
    maxWidth: 300
  });
  google.maps.event.addListener(marker, "click", function() {
    if (currentPopup != null) {
      currentPopup.close();
      currentPopup = null;
    }
    popup.open(map, marker);
    currentPopup = popup;
  });
  google.maps.event.addListener(popup, "closeclick", function() {
    map.panTo(center);
    currentPopup = null;
  });
}

function initMap() {
  map = new google.maps.Map(document.getElementById("map"), {
    center: new google.maps.LatLng(0, 0),
    zoom: 14,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    mapTypeControl: false,
    mapTypeControlOptions: {
      style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR
    },
    navigationControl: true,
    navigationControlOptions: {
      style: google.maps.NavigationControlStyle.SMALL
    }
  });

  $name = 'New York';
  $lat = 40.7127837;
  $lon = -74.0059413;
  $desc = 'New York, NY';
  addMarker($lat, $lon, '<b>' + $name + '</b><br/>' + $desc);

  $name = 'Newark';
  $lat = 40.735657;
  $lon = -74.1723667;
  $desc = 'Newark, NJ';
  addMarker($lat, $lon, '<b>' + $name + '</b><br/>' + $desc);

  center = bounds.getCenter();
  map.fitBounds(bounds);

}
google.maps.event.addDomListener(window, "load", initMap);
&#13;
html {
  height: 100%;
}
body {
  height: 100%;
  margin: 0;
  padding: 0;
}
#map {
  height: 100%;
}
&#13;
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map"></div>
&#13;
&#13;
&#13;

答案 1 :(得分:-1)

看起来你正在制作地图的中心0,0。尝试使用latlgn的中心值初始化地图。