javascript - Google Map Mark Not Working -
i following tutorial of google map on google developer , trying make google map mark. after made that, pin on map shows white rectangle, instead of map pin. here link made
here code:
head.php:
<head> <title><?php echo $title; ?></title> <meta charset = "utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" type="text/css" href="style/sponsor_enquiry_style.css"> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script> <script type="text/javascript" src="script/script.js"></script> <script type="text/javascript" src="script/map.js"></script> </head> enquiry.php
<!doctype html> <html> <?php $title = 'enquiry'; include 'php/head.php'; ?> <body> <?php include 'php/nav.php'; include 'php/header.php'; include 'php/preloader.php'; ?> <section class = "main_content"> <div id = "enquiry_content"> <div id = "opening_info"> <h1>// opening</h1> <h1 class = "font_ch">開幕典禮</h1> <h2>13.6.15</h2> <p>15:00–17:00</p> <p>room cva 104, communication , visual arts building, hkbu, 5 hereford road, kowloon tong, kowloon</p> <p class = "font_ch">九龍塘禧福道五號香港浸會大學傳理視藝大樓104室</p> </div> <div id = "exhibition_info"> <h1>// exhibition</h1> <h1 class = "font_ch">展覽期</h1> <h2>14–21 june</h2> <p>11:00–21:00</p> <p>koo ming kown exhibition gallery cva bldg, hkbu</p> <p class = "font_ch">浸大傳理及視藝大樓顧明均展覽廳</p> </div> <div id = "screening_info"> <h1>// screening</h1> <h1 class = "font_ch">放映會</h1> <h2>14 & 21 june</h2> <p>14:00–18:00</p> <p>yue hwa chinese products lecture theatre cva bldg, hkbu</p> <p class = "font_ch">浸大傳理及視藝大樓裕華國貨演講廳</p> </div> <div id="map-canvas"></div> </div> </section> <?php include 'php/footer.php'; ?> </body> </html> sponsor_enquiry_style.css:
.main_content { padding: 80px 15px; width: 600px; max-width: 95%; margin: 0 auto; } .main_content h1 { display: inline-block; } .main_content #enquiry_content #opening_info, .main_content #enquiry_content #exhibition_info, .main_content #enquiry_content #screening_info, .main_content #sponsors_content #organizer_info, .main_content #sponsors_content #media_info{ margin: 30px 0; } .main_content #sponsors_content .sponsor_icons img { transform: scale(0.85, 0.85); -o-transform: scale(0.85, 0.85); -ms-transform: scale(0.85, 0.85); -webkit-transform: scale(0.85, 0.85); } #map-canvas { max-width: 100%; height: 300px; } map.js
function initialize() { var mylatlng = new google.maps.latlng(22.334134,114.182465); var mapoptions = { zoom: 15, center: mylatlng } var map = new google.maps.map(document.getelementbyid('map-canvas'), mapoptions); var marker = new google.maps.marker({ position: mylatlng, map: map, }); } google.maps.event.adddomlistener(window, 'load', initialize);
i'm not sure it's for, in home.css you've defined style <canvas> affects map(which uses canvas). use more specific selector exludes #map-canvas
Comments
Post a Comment