• 締切済み

Google Maps APIについて質問です

こんにちは。 現在大学の研究の一環で、Google Maps APIについて学習しております。 APIに関して全くの初心者ですが、質問があります。 今回必要としている機能として、羊ケ丘展望台から札幌駅へ向かう2ルートを地図上に表示させたいのですが 下記に示すようなものが現在できております。 ですが、まだ一つのルートしか表示できません。 このルートをそのままに、同じ出発地と到着地で(43.034047,141.359536)を経由するルートを赤いラインで追加したいと思っているのですが、 この場合はどういったコードになるのでしょうか? かなりいろいろ調べてみましたが、初心者ゆえなかなか上手くできません。 どなたか知識をお持ちの方がいらっしゃいましたら、ご助力頂きたく存じます。 何卒宜しくお願い致します。 <html> <head> <title>Google Maps V3</title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" /> <style type="text/css"> v\:* {behavior:url(#default#VML);} html, body {width: 100%; height: 100%} body {top:0px;left:0px;margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-bottom: 0px} </style> <script src="http://maps.google.com/maps/api/js?sensor=false"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script> google.maps.event.addDomListener(window, 'load', function() { var mapObj; var lng = 139.8131925612688; var lat = 35.73369469149347; var mapOptions = { zoom: 11, center: null, mapTypeId: google.maps.MapTypeId.ROADMAP, scaleControl: true }; mapObj = new google.maps.Map(document.getElementById('gmap'), mapOptions); // ルートを表示するマップを設定 var directionsRenderer = new google.maps.DirectionsRenderer(); directionsRenderer.setMap(mapObj); // 開始地点と終了地点、ルーティングの種類の設定 var request = { origin: "羊ケ丘展望台", destination: "札幌駅", travelMode: google.maps.DirectionsTravelMode.DRIVING }; // ルート検索を行う var directionsService = new google.maps.DirectionsService(); directionsService.route(request, function(result, status) { if (status == google.maps.DirectionsStatus.OK) { directionsRenderer.setDirections(result); } }); // Monitor the window resize event and let the map know when it occurs if (window.attachEvent) { window.attachEvent("onresize", function() {this.map.onResize()} ); } else { window.addEventListener("resize", function() {this.map.onResize()} , false); } }); </script> </head> <body> <div id="gmap" style="top:0px;left:0px;width: 100%; height: 100%;"> </div> </body> </html>

みんなの回答

  • yamada_g
  • ベストアンサー率68% (258/374)
回答No.1

たとえば現状のルート表示処理のあとに、 // 別ルート表示処理 var directionsRenderer2 = new google.maps.DirectionsRenderer({polylineOptions:{strokeColor: "red"}}); directionsRenderer2.setMap(mapObj); request = { origin: "羊ケ丘展望台", destination: "札幌駅", travelMode: google.maps.DirectionsTravelMode.DRIVING, waypoints: [ { location: new google.maps.LatLng(43.034047,141.359536) } ] }; directionsService.route(request, function(result, status) { if (status == google.maps.DirectionsStatus.OK) { directionsRenderer2.setDirections(result); } }); こんなのを追加すればいいのではないでしょうか。(処理をまとめたりするのはご自身で・・) ただ、自分は今回の質問を拝見して初めてGoogle Maps APIを触った、というレベルですので、もっとうまい方法もあるのだと思います。

naridanjp
質問者

お礼

上手くできました!有難うございました!

関連するQ&A

  • google maps api ルート線変更

    Google Maps JavaScript API v3 でルート検索で表示されるポリラインの色や太さを変更したいのですが行き詰ってます。 ネットで調べてますと、polylineOptionのstrokeColorやstrokeWeightなどで変更できるような事は書いてあるのですが、どうやってもうまくいきません。 Googleデベロッパーで紹介されています下記のルートサービスのひな形をもとにいろいろやっているのですが、どこにどのように記述すればいいのでしょうか。 ------------------------------------------------ var directionsDisplay; var directionsService = new google.maps.DirectionsService(); var map; function initialize() { directionsDisplay = new google.maps.DirectionsRenderer(); var chicago = new google.maps.LatLng(41.850033, -87.6500523); var mapOptions = { zoom:7, mapTypeId: google.maps.MapTypeId.ROADMAP, center: chicago } map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); directionsDisplay.setMap(map); } function calcRoute() { var start = document.getElementById("start").value; var end = document.getElementById("end").value; var request = { origin:start, destination:end, travelMode: google.maps.TravelMode.DRIVING }; directionsService.route(request, function(result, status) { if (status == google.maps.DirectionsStatus.OK) { directionsDisplay.setDirections(result); } }); } --------------------------------------------------

  • Google AJAX API のmapsのロードとIEでの表示について

    いつもお世話になっています。 Google AJAX APIについて質問です。 デベッロッパーガイドに従って以下のようにスクリプトを書いたのですが IEのみエラーが出て表示されません。 (IE7でも表示はされましたが、不安定でした) <html> <head> <script type="text/javascript" src="http://www.google.com/jsapi?key=登録したAPIキー"></script> <script type="text/javascript"> google.load("maps", "2"); function initialize() { var map = new google.maps.Map2(document.getElementById("map")); map.setCenter(new google.maps.LatLng(37.4419, -122.1419), 13); } google.setOnLoadCallback(initialize); </script> </head> <body> <div id="map" style="width: 400px; height: 400px"></div> <div id="searchcontrol"></div> </body> </html> なぜIEだけが表示されないのか、エラーが出るのかわかる方いらっしゃいましたらよろしくお願いします。

  • Google maps api v3

    https://developers.google.com/maps/articles/phpsqlajax_v3?hl=ja を参考にコーディングし、いろいろなサイトも調べてながら(手探り)ですが、どうしてもうまく表示されません。 【maps.php】にてxmlデータを生成しました。それを使ってサイトに表示させるというものです。 うまく表示されないというか、画面が真っ白になってしまいます。 アドバイス等ご教示頂ければ幸甚です。 【index.html】 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Maps</title> <script src="http://maps.google.com/maps/api/js?sensor=false"></script> <script type="text/jacascript"> //<![CDATA[ function load() { var map = new google.maps.Map(document.getElementById("map"), { center: new google.maps.LatLng(35.66, 139.69), zoom: 13, mapTypeId: 'roadmap' }); var infoWindow = new google.maps.InfoWindow; // Change this depending on the name of your PHP file downloadUrl("maps.php", function(data) { var xml = parseXml(data); var markers = xml.documentElement.getElementsByTagName("marker"); for (var i = 0; i < markers.length; i++) { var name = markers[[]i].getAttribute("name"); var address = markers[[]i].getAttribute("address"); var tel = markers[[]i].getAttribute("tel"); var email = markers[[]i].getAttribute("email"); var message = markers[[]i].getAttribute("message"); var point = new google.maps.LatLng( parseFloat(markers[[]i].getAttribute("lat")), parseFloat(markers[[]i].getAttribute("lng"))); var html = "" + name + " " + address; var icon = customIcons[[]type] || {}; var marker = new google.maps.Marker({ map: map, position: point, icon: icon.icon, shadow: icon.shadow }); bindInfoWindow(marker, map, infoWindow, html); } }); } function bindInfoWindow(marker, map, infoWindow, html) { google.maps.event.addListener(marker, 'click', function() { infoWindow.setContent(html); infoWindow.open(map, marker); }); } function downloadUrl(url, callback) { var request = window.ActiveXObject ? new ActiveXObject('Microsoft.XMLHTTP') : new XMLHttpRequest; request.onreadystatechange = function() { if (request.readyState == 4) { request.onreadystatechange = doNothing; callback(request.responseText, request.status); } }; request.open('GET', url, true); request.send(null); } function parseXml(str) { if (window.ActiveXObject) { var doc = new ActiveXObject('Microsoft.XMLDOM'); doc.loadXML(str); return doc; } else if (window.DOMParser) { return (new DOMParser).parseFromString(str, 'text/xml'); } } function doNothing() {} //]]> </script> </head> <body onload="load()"> <div id="map" style="width: 500px; height: 300px"></div> </body> </html>

  • Google maps API V3 ルート案内

    2点間距離を測定するGoogle maps サンプル(下記)を入手したのですが、次のように手直ししたいと考えています。ご教授の程、よろしくお願い致します。 (1)出発地は決まっているので、「◯◯から」の◯◯の表示は必要ありません。 (2)そのかわり、出発地のポイントと名称をあらかじめ表示させておきたい。 (3)目的地の住所を入力して検索するだけで案内が表示される。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=yes"> <title>Google Maps API v3 Directions Draggable</title> <style type="text/css"> body {background-color: #B7C4C8; font-family: Arial, "MS PGothic"; text-align: center; font-size: small;} div#wrapper {width: 728px; margin: 0 auto; padding: 0; text-align: left;} </style> <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> <script type="text/javascript"> var rendererOptions = {draggable: true}; var directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions); var directionsService = new google.maps.DirectionsService(); var map; var aqui = new google.maps.LatLng(35.69, 139.71); function initialize() { var myOptions = {zoom: 10, center: aqui, mapTypeId: google.maps.MapTypeId.ROADMAP}; map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); directionsDisplay.setMap(map); directionsDisplay.setPanel(document.getElementById("directionsPanel")); google.maps.event.addListener(directionsDisplay, "directions_changed", function() { computeTotalDistance(directionsDisplay.directions); }); calcRoute(); } function calcRoute(fromAddress, toAddress) { var selectedMode = document.getElementById("mode").value; var fromAddress = document.getElementById("fromAddress").value; var toAddress = document.getElementById("toAddress").value; var request = {origin: fromAddress, destination: toAddress, travelMode: google.maps.DirectionsTravelMode[selectedMode]}; directionsService.route(request, function(response, status) { if (status == google.maps.DirectionsStatus.OK) { directionsDisplay.setDirections(response); } }); } function computeTotalDistance(result) { var total = 0; var myroute = result.routes[0]; for (i = 0; i < myroute.legs.length; i++) { total += myroute.legs[i].distance.value; } total = total / 1000. document.getElementById("total").innerHTML = total + " km"; } </script> </head> <body onload="initialize()"> <div id="wrapper"> <div style="margin-bottom: 8px;"> <strong>Directions: モード=</strong> <select id="mode" onchange="calcRoute();"> <option value="DRIVING">車</option> <option value="WALKING">歩き</option> </select> <form action="#" onsubmit="calcRoute(this.fromAddress.value, this.toAddress.value); return false"> <input type="text" size="12" id="fromAddress" name="from" value=""/>から&nbsp;~&nbsp; <input type="text" size="12" id="toAddress" name="to" value="" />へのルートを&nbsp; <input name="submit" type="submit" value="検索" />&nbsp;またはドラッグ&ドロップ </form> </div> <div id="map_canvas" style="float:left; width:500px; height:400px;"></div> <div id="directionsPanel" style="margin-left: 505px; width:223px; height: 400px; overflow: auto; background-color: #FFF;"><p>距離: <span id="total"></span></p></div> <div style="margin-top: 12px;"> <script type="text/javascript"><!-- google_ad_client = "ca-pub-9624687380026797"; /* 728-90Big */ google_ad_slot = "2458118948"; google_ad_width = 728; google_ad_height = 90; //--> </script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> </div> <!--/ #wrapper--></div> <script type="text/javascript"> <!-- var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-1220676-1']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.src = 'http://www.google-analytics.com/ga.js'; ga.setAttribute('async', 'true'); document.documentElement.firstChild.appendChild(ga); })(); // --> </script> </body> </html> 以上です。よろしくお願い致します。

  • Google maps api v3と印刷について

    お世話になります。 Google maps api v3を使用して、WEBサイトに地図をアップしたのですが、 お客様から印刷すると地図の表示がおかくしくなると指摘されました。 印刷プレビューから表示がおかしくなるとの事です。(その方はWinXP IE8) いろいろ原因を探したのですがよく分からず、こちらでお力をお貸し頂ければと思います。 こちらで分かった事といえば、印刷時、設定用紙の半分もしくは3分の2より下に地図が 配置されていると、表示がおかしくなるということです。 (1枚目に地図が全部配置されているのに、2枚目にも地図の下部のみが移ってしまい、地図の直後にあるコンテンツを隠してしまう。その時、1枚目の地図もおかしい等) (ただし、地図を設定用紙の半分より上に配置すると地図等は問題なく表示・印刷される。ポリゴンも隠れない) この現象は私が作成したmapだけでなく、他のサイトのGoogle mapsでも同じ現象のような気がします。(たまたまでしょうか?) 回避方法等、どうぞお力をお貸しくださいませ。 <script type="text/javascript"> <!-- google.maps.event.addDomListener(window, 'load', function() { // 地図の設定 var mapOptions = { zoom: 16, center: new google.maps.LatLng(30.622401694889774, 138.72735120224), mapTypeId: google.maps.MapTypeId.ROADMAP, scaleControl: true }; var mapObj = new google.maps.Map(document.getElementById('gmap'), mapOptions); // 作成するポリゴン外枠座標の配列 var points = [ new google.maps.LatLng(30.62244094020011, 138.7270232439041), new google.maps.LatLng(30.62266551021649, 138.7274872660637), new google.maps.LatLng(30.6226175438582, 138.7275274991989), new google.maps.LatLng(30.62263062559512, 138.72755163908005), new google.maps.LatLng(30.622401694889774, 138.72773402929306), new google.maps.LatLng(30.6224191372523, 138.72777426242828), new google.maps.LatLng(30.622251254355135, 138.72789764404297), new google.maps.LatLng(30.62193729058848, 138.7273102402687), new google.maps.LatLng(30.622377711635124, 138.72697496414184), new google.maps.LatLng(30.622410416071524, 138.72704201936722) ]; // ポリゴンのオプションを設定 var polygonOptions = { path: points, strokeWeight: 2, strokeColor: "#ff0000", strokeOpacity: 0.5, fillColor: "#ff0000", fillOpacity: 0.3, title:"ポリゴン" }; // ポリゴンを設定 var polygon = new google.maps.Polygon(polygonOptions); polygon.setMap(mapObj); // クリック処理・吹き出しのコメント設定 google.maps.event.addListener(polygon, 'click', function() { new google.maps.InfoWindow({ content: '品川testホテル<br>〒141-0001<br>東京都品川区', maxWidth : 200, position: new google.maps.LatLng(30.622401694889774, 138.72735120224) }).open(mapObj); }); //polygonのみ最初から吹き出しを表示させる(擬似的にクリックイベントを発生させる) google.maps.event.trigger(polygon,'click'); }); //--> </script> 【CSS】 #gmap { width: 630px; height: 300px; margin-left: 30px; border: #ccc 1px solid; } ※緯度・軽度は正確ではありません。申し訳ありません。 ※地図の前後にはfloatが掛かったコンテンツがあります。(clearfixで解除済み) ※専門用語はよく分からないので、出来るだけ分かるように記載頂けると幸いです。

  • google maps APIのジオコーディング

    google maps APIで2箇所の住所を入力し、ジオコーディングし、マーカーを表示させ、2箇所のマーカーの中間点が画面の中心になるように表示させたいのですが、なかなか地図の中心を移動できません。どのようにすればうまくできるでしょうか? //HTML <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title> ジオコーディング</title> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <style type="text/css"> html { height: 100% } body { height: 100%; margin: 0px; padding: 0px } #map_canvas { height: 100% } </style> </head> <body onload="initialize()"> <div> 地点1<input id="start" type="textbox" size="50"><br> 地点2<input id="goal" type="textbox" size="50"> <input type="button" value="地図表示" onclick="codeAddress()"> </div> <div id="map_canvas" style="height:80%"></div> <br>地点1 <div id="geocoder_info" style="height:10%"></div> 地点2 <div id="geocoder_info2" style="height:10%"></div> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="http://maps.google.com/maps/api/js?sensor=false"> </script> <script src="geocode.js"></script> </body> </html> //javascript geocode.js var map; var geocoder; function initialize() { geocoder = new google.maps.Geocoder(); var latlng = new google.maps.LatLng(35.699338,139.705146); var myOptions = { zoom: 12, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map($("#map_canvas").get(0), myOptions); } function codeAddress() { var address = document.getElementById("start").value; var info = document.getElementById("geocoder_info"); geocoder.geocode( {'address': address},function(results, status) { info.innerHTML = results[0].formatted_address + "<br>" + results[0].geometry.location; if (status == google.maps.GeocoderStatus.OK) { Slat = results[0].geometry.location.lat(); Slng = results[0].geometry.location.lng(); var marker = new google.maps.Marker({ map: map, position: results[0].geometry.location }); } else { alert("次の理由でジオコーディングに失敗しました: " + status); } }); var address2 = document.getElementById("goal").value; var info2 = document.getElementById("geocoder_info2"); geocoder.geocode( { 'address': address2},function(results2, status2) { info2.innerHTML = results2[0].formatted_address + "<br>" + results2[0].geometry.location; if (status2 == google.maps.GeocoderStatus.OK) { Glat = results2[0].geometry.location.lat(); Glng = results2[0].geometry.location.lng(); var marker2 = new google.maps.Marker({ map: map, position: results2[0].geometry.location }); } else { alert("次の理由でジオコーディングに失敗しました: " + status); } }); latCenter = ((results[0].geometry.location.lat()) + (results2[0].geometry.location.lat()))/2; lngCenter = ((results[0].geometry.location.lng()) + (results2[0].geometry.location.lng()))/2; map.setCenter(latCenter,lngCenter); }

  • Google maps API V3 検索ボックス

    Google maps API V3 で、kmlファイルを利用した地図(http://itohiki119.iinaa.net/bousai/test.html) を作成しました。 この地図に検索ボックスを追記したいのですが、上手くいきません。 お知恵をお貸し下さい。m(_ _)m 一応、http://code.google.com/p/gmaps-api-v3-googlebar/downloads/list からダウンロード (1) gmaps-api-v3-googlebarから入手したファイルを解凍。 (2) その中のjGoogleBarV3.jsとdefault.cssを適当な位置に配置。 (3) scriptとlinkを追加。 してみたのですが、ダメでした。 もともとの、htmlは、下記の通りです。 _/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/ <html lang="ja"> <head> <meta charset="UTF-8"> <title>避難所マップ</title> <meta name="viewport" content="initial-scale=1.0, user-scalable=yes" /> <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true&language=ja"></script> <script type="text/javascript"> function initialize() { var initPos = new google.maps.LatLng(34.794267, 134.717400); var myOptions = { zoom : 15, center : initPos, mapTypeId : google.maps.MapTypeId.ROADMAP }; map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); var kmlOptions = {preserveViewport: true} var ctaLayer = new google.maps.KmlLayer('http://itohiki119.iinaa.net/bousai/test.kml', kmlOptions); ctaLayer.setMap(map); } </script> </head> <body onload="initialize()"> <div id="map_canvas" style="width: 100%; height: 100%;"><br /></div> </body> </html> _/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_ よろしくお願い致します。

  • 非常に困ってます。Google mapsの作成

    およびスタイルシートの活用 メモ帳にて 以下のソースコードにて試したのですがIEで右側しか表示されないで困ってます。多少いじってます。 このソースコードでmapを表示できるよう指摘をお願いします。 とても長いですが自力ではもう分からなくて手つかずです。 <!DOCTYPE html "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>1マップ</title> <style type="text/css"> <!-- h2 { text-align:left; font-size:25px } p { margin-top:0px; text-align:justify; text-justify:distribute; line-height:15pt; font-size:16px; color:black } .text1div { border-style:solid; border-width:4px; border-color:#ffffff; padding:3px; width:330px; height:325px; border:solid 0px; overflow:auto; background-color:white darkblue darkblue white; scrollbar-base-color: #ffffff; scrollbar-highlight-color:#009999; position:absolute; left:410px; top:70px } P.text1 { text-align:justify; text-justify:distribute; line-height:120%; font-size:15px } --> </style> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></scr ipt> <script type="text/javascript"> function initialize() { var latlng = new google.maps.LatLng(座標); var opts = { zoom: 13, center: latlng, scaleControl: true, mapTypeId: google.maps.MapTypeId.ROADMAP } var map = new google.maps.Map(document.getElementById("map_canvas"), opts); var marker = new google.maps.Marker({position: latlng,map: map }); var infowindow = new google.maps.InfoWindow({content:'*****',position: latlng }); infowindow.open(map); </script> </head> <body onload="initialize()"> <h2>My Maps</h2> <div id="map_canvas" style="width:400px; height:300px"></div> <DIV CLASS="text1div"><P CLASS="text1"> マップです。<BR> **市**区*条**丁目*番*号<BR> Tel ***-***-***<BR><BR> <DIV> <DIV align="center"> <form><input type="button" name="OK" value=" Close " onClick="window.close()"></form> </DIV> </body> </html>

    • 締切済み
    • CSS
  • Google maps API のマーカーを増やす

    お恥ずかしながらJavascriptが全く分からない者です。 しかし、必要が生じ、いじっていますが、 下記のソースで、マーカーの個数を増やす場合、 何処のソースをどのように増やせばいいのでしょうか? また、その他やり方がありましたら、 ご教授いただければと思い、 質問させていただきました。 よろしくお願いいたします。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "?http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">? <html xmlns="?http://www.w3.org/1999/xhtml">? <head> <title>テスト</title> <link href="../../css/css.css" rel="stylesheet" type="text/css" /> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <script src="?http://maps.google.com/maps?file=api&amp;v=2&amp;key=?****" type="text/javascript"></script> </head> <body> <h1>テスト</h1> <div id="map" style="width: 500px; height: 300px"></div> <script type="text/javascript"> //<![CDATA[ if (GBrowserIsCompatible()) { var map = new GMap2(document.getElementById("map")); map.addControl(new GLargeMapControl()); var point = new GLatLng(35.852766, 139.794382); map.setCenter(point, 16); var marker = new GMarker(point); map.addOverlay(marker); GEvent.addListener(map, 'click', function(overlay, point) { if (overlay) { overlay.openInfoWindow( document.createTextNode("テスト")); } }); } //]]> </script> </body> </html>

    • ベストアンサー
    • HTML
  • Google Maps API

    Google Maps APIについてよくわからないのですが 自分のサイトに地図を埋め込むことを言うのですよね? でもグーグルマップを開いて 「リンクを共有/地図を埋め込む」 のURLを自分のサイトに張り付ければ Google Maps APIを使わなくてもできると言う事ですか? それとも、Google Maps APIと 地図の埋め込みは、違うものなのでしょうか?

専門家に質問してみよう