簡體   English   中英

地圖停止顯示-Google MAP v3 API

[英]Map stopped showing - Google MAP v3 API

我有一個網頁顯示帶有2個自定義標記的地圖。 直到今天,該頁面運行良好。 我猜谷歌對API或類似的東西做了一些更新。 這是代碼:

<head>
<link href="/maps/documentation/javascript/examples/default.css" rel="stylesheet">
<style>
body { padding:0; margin:0; }

table#details td
{
    text-align:center;
        font-size:18px;
    background-image: -ms-linear-gradient(top, #FFFFFF 0%, #85c7d7 100%);
    background-image: -moz-linear-gradient(top, #FFFFFF 0%, #85c7d7 100%);
    background-image: -o-linear-gradient(top, #FFFFFF 0%, #85c7d7 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFFFFF), color-stop(1, #85c7d7));
    background-image: -webkit-linear-gradient(top, #FFFFFF 0%, #85c7d7 100%);
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #85c7d7 100%);
    background-color:#FFF;
        border-radius:15px;
-moz-border-radius:15px; /* Old Firefox */
}
table#details
{
    background-image:url(images/backtable.jpg);
    background-image:();
        width:680px;
}

body {
    font-family: Calibri,"Gill Sans","Gill Sans MT","Myriad Pro",Myriad,Frutiger,"Frutiger Linotype",Univers,"DejaVu Sans Condensed","Liberation Sans","Nimbus Sans L",Tahoma,Geneva,"Helvetica Neue",Helvetica,Arial,sans-serif;
}

input
{
    border:solid 1px black;
    padding:10px;
    margin:5px;
}
select
{
    border:solid 1px black;
    padding:10px;
    margin:5px;
}
#map-canvas {
        height: 200px;
        width: 300px;
        margin:20px;
        float:left;
      }
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>

</head>
<body>


        <table id="details">
            <tr>
            <td>
            <div id="map-canvas1" style="margin:15px;width:300px; height:220px; float:left;"></div>
            </td><td width=380>
            <h3 style="color:#F00;">Une clinique a besoin de vous!</h3>
            <img src="images/intercom.png" style="margin-top:-15px;"><br/>

        de <b>8h</b> &agrave; <b>18h</b><br/><span style="text-transform:uppercase">Clinique Du ruisseau de la bonne etoile <br/>4885 Henri-Bourassa  ville Montreal<br/>
</span>
<img src="images/accepteoffre.png" style="cursor:pointer;padding-top:10px;" onClick="document.location= 'insertwishdispo.aspx?Seq=3087&Midi=1&Tel=5146298488&HeureDebut=8&HeureFin=18&SeqH=1010&SeqC=7&Jour=9&Annee=2014&Mois=4&Courriel=thomasdc7@hotmail.com&MotDePasse=alloallo'"/>

<br/><span style="cursor:pointer;font-size:12px;" onClick="document.location = 'add_hd.aspx?Annee=2014&Mois=4&Jour=9&Seq=1010&Courriel=thomasdc7@hotmail.com&MotDePasse=alloallo';"><u>Je d&eacute;cline mais je veux cr&eacute;er une autre disponibilit&eacute;</u></span>
</td>
</tr>
</table>

 <script>

function initialize() {




 var Center=new google.maps.LatLng(18.210885,-67.140884);
    var directionsDisplay1;
    var directionsService1 = new google.maps.DirectionsService();
    var properties1 = {
    suppressMarkers: true
};


  directionsDisplay1 = new google.maps.DirectionsRenderer(properties1);


  //latLng = new google.maps.LatLng(45.522699, -73.7068679)
  latLng = new google.maps.LatLng(45.522699, -73.7068679)
  var mapOptions1 = {
    zoom: 14,
    mapTypeControl: false,
      scaleControl: false,
      zoomControl: false,
      streetViewControl: false,
    center: latLng,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
  };

  var map1;
  map1 = new google.maps.Map(document.getElementById('map-canvas1'),
      mapOptions1);
    directionsDisplay1.setMap(map1);
    var marker1 = new google.maps.Marker({
      position: latLng,
      title:"Clinique",
      visible: true,
      icon: 'images/toothmap.png'
  });

    latLng = new google.maps.LatLng(45.5196215, -73.7337152)

    var markerMe1 = new google.maps.Marker({
      position: latLng,
      title:"Moi",
      visible: true,
      icon: 'images/avatars_map.png'
  });
  marker1.setMap(map1);
  markerMe1.setMap(map1);


var start1 = new google.maps.LatLng(45.522699, -73.7068679)
var end1 =  new google.maps.LatLng(45.5196215, -73.7337152)
var request1 = {
origin:start1,
destination:end1,
travelMode: google.maps.TravelMode.DRIVING
 };

 directionsService1.route(request1, function(result, status) {
if (status == google.maps.DirectionsStatus.OK) {
  directionsDisplay1.setDirections(result);
}
});





}

function loadScript() {
  var script = document.createElement('script');
  script.type = 'text/javascript';
  script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&' +
      'callback=initialize';
  document.body.appendChild(script);
}
loadScript();

</script>

</body>

該頁面是使用aspx循環生成的,因此這就是為什么將對象命名為objectname'1'的原因,

有趣的部分是它最近沒有更改就可以正常工作,這意味着它必須與不再允許的更新或代碼有關。

這實際上在工作。.http://jsfiddle.net/baL75/1/我必須進行一些更改:

在標記圖片網址上

icon: 'http://lorempixel.com/40/20/'

在初始化的上下文中。

initialize = function() {

但這就是全部。.沒有API更改會使您的代碼無法正常工作。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM