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);
}
});
}
--------------------------------------------------
No.1ベストアンサー
- 回答日時:
DirectionsRendererのoption設定で、色や太さを設定できます。
>ネットで調べてますと
map apiに関しては本家のgoogleから詳細なドキュメントが公開されていますので、そちらを調べるのが一番です。
(この回答もそこを見ただけです。)
https://developers.google.com/maps/documentation …
具体的には、初期設定で、
directionsDisplay = new google.maps.DirectionsRenderer();
directionsDisplay.setOptions({
polylineOptions: { strokeColor:"#f00", strokeWeight:6 }
});
とか。
以前、似たようなルート検索の質問がありましたので、ご参考までに。
http://oshiete.goo.ne.jp/qa/8159078.html
ありがとうございます。
実は、教えて頂いた設定もためしてみたのですが、ぜんぜんダメだったのです。
ダメと言いますか設定する位置に問題があるのだと思います。
もう少しいろいろと探ってみて、原因が絞れてきましたら改めて質問させていただきます。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 1日1回引けるJavaScriptおみくじについて 1 2022/12/12 22:28
- JavaScript gasについて 1 2022/05/31 21:51
- オープンソース Coinmarketcap api 1 2022/05/30 15:47
- JavaScript 画像の表示位置 3 2022/12/23 08:25
- JavaScript コードレビューをお願いします。 1 2022/07/16 05:38
- Google Maps Google Maps にお店の名前を表示する方法は? 2 2022/12/26 16:21
- その他(プログラミング・Web制作) google formsを使ったタスク依頼フォーム作成におけるご相談 1 2023/06/22 15:55
- JavaScript Google reCAPTCHAについて 1 2023/02/22 14:37
- JavaScript javascript作成してます。ラジオボタンで判定するコードを書いてます。 1 2023/07/18 11:03
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
C#OpenCv V4にのエラーに関する...
-
google apps scriptの終了のさせ方
-
GASでundefinedエラーが出ます
-
リンク集をCSVファイルで管理し...
-
正規表現について質問です。条...
-
ホームページの最終更新日を他...
-
GASでGoogleフォームの自動返信...
-
ASP.NET MVCでObjectをjsに渡す
-
JavaScriptを使って毎日決まっ...
-
ジェネレーターの作り方
-
ASP.NETのコントロールの値をJa...
-
javascriptでiframeのURL変更は?
-
jsによって検索プルダウン、都...
-
Google Apps Script で添付ファ...
-
html javascript リンク先アド...
-
翌月を取得するGASが分かりません
-
JavaScriptで日付を取得したいです
-
毎週土曜日のみの日付を取得、...
-
JavaScriptで平日のみをカウン...
-
アルファベットABCD…をスマート...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
var exports = exports || {}; ...
-
google apps scriptの終了のさせ方
-
C#OpenCv V4にのエラーに関する...
-
GASでundefinedエラーが出ます
-
ジェネレーターの作り方
-
GASでGoogleフォームの自動返信...
-
HTMLで作った時報アプリが動き...
-
javascriptでテーブルに追加し...
-
html javascript リンク先アド...
-
【西暦等の変換】
-
ローカルにあるファイルを検索...
-
ASP.NETのコントロールの値をJa...
-
なぜmatchメソッドがエラーにな...
-
翌月を取得するGASが分かりません
-
gas スプレッドシートがアクテ...
-
ASP.NET MVCでObjectをjsに渡す
-
カンマで終わってるのはセミコ...
-
JavaScriptで文字列の特定文字...
-
javascriptでiframeのURL変更は?
-
APIを使って埋め込んだグーグル...
おすすめ情報