2

サイトに Google マップを埋め込んでいますが、情報バブルの名前を「住所」以外の名前に変更できるようにしたいと考えています。例として、情報バブルの「住所」を変更したいと考えています。リンクをたどると、「賢い人はここで働いています」と表示されます

<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=One+Exchange+Plaza,+26th+Floor+New+York,+NY+10006&amp;aq=&amp;sll=37.0625,-95.677068&amp;sspn=39.371738,86.572266&amp;ie=UTF8&amp;hq=&amp;hnear=1+Exchange+Plaza,+New+York,+10006&amp;t=m&amp;z=14&amp;ll=40.706793,-74.012592&amp;output=embed"></iframe><br /><small><a href="http://maps.google.com/maps?f=q&amp;source=embed&amp;hl=en&amp;geocode=&amp;q=One+Exchange+Plaza,+26th+Floor+New+York,+NY+10006&amp;aq=&amp;sll=37.0625,-95.677068&amp;sspn=39.371738,86.572266&amp;ie=UTF8&amp;hq=&amp;hnear=1+Exchange+Plaza,+New+York,+10006&amp;t=m&amp;z=14&amp;ll=40.706793,-74.012592" style="color:#0000FF;text-align:left">View Larger Map</a></small>
4

2 に答える 2

0

私が知っていることから、そのバブルを変更するには、独自の JavaScript ページを作成する必要があります。基本的な API コンポーネントしか使用していませんが、単一のマーカーではかなり面倒だと思います。カスタマイズ性が高いのがメリットです。道順や検索リンクは省略して、原文をそのままコピーしてみました。

<!DOCTYPE html>
<html>
  <head>
    <style type="text/css">
      html, body { margin: 0; padding: 0; height: 100% }
      #infoContents { color: blue; font-family: Arial, sans-serif; font-size: 12px }
    </style>
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
    <script type="text/javascript">
      var map;
      var spot = new google.maps.LatLng(40.706793,-74.012592);
      var mapCenter = new google.maps.LatLng(40.712583,-74.00933592);
      var mapOptions = { center: mapCenter, zoom: 14,
        mapTypeId: google.maps.MapTypeId.ROADMAP };

      function initialize() {
        map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
        var iconShadow = new google.maps.MarkerImage(
          "http://www.google.com/mapfiles/ms/micons/msmarker.shadow.png", 
          new google.maps.Size(59,32),
          new google.maps.Point(0,0),
          new google.maps.Point(15,32));

        var marker = new google.maps.Marker({
          map: map,
          position: spot,
          icon: "http://www.google.com/mapfiles/markerA.png",
          shadow: iconShadow
        });

        var infowindow = new google.maps.InfoWindow({
          content: '<div id="infoContents"><b style="font-size: 16px">I am so Smart</b><br><br>1 Exchange Plaza<br>New York, NY 10006</div>'
        });

        infowindow.open(map, marker);
      }

      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
    <div id="map_canvas" style="width: 425px; height: 350px;"></div>
  </body>
</html>
于 2012-05-23T22:59:48.070 に答える
0

2016 年にこれを読んでいる場合は、Google MyMaps で地図を作成して時間を節約できます ;)

于 2016-02-23T16:59:31.780 に答える