Google Maps JavaScript APIにて表題のオプションを試す。
■ 環境
- Google Maps JavaScript API v3
■ draggableCursor
地図上でドラッグ可能であれば表示するアイコンである。デフォルトでは手が開いているアイコンが表示される。
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: 35.681382, lng: 139.766084},
zoom: 8,
draggableCursor: "url(http://tech.withsin.net/dev/icon1.png), auto"
});
}
地球のアイコンにしてみた。
■ draggingCursor
ドラッグ中のアイコンを指定する。デフォルトでは手が閉じてつまんでいるようなアイコンが表示される。
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: 35.681382, lng: 139.766084},
zoom: 8,
draggableCursor: "url(http://tech.withsin.net/dev/icon1.png), auto",
draggingCursor: "url(http://tech.withsin.net/dev/icon2.png), auto",
});
}
ドラッグ中は火星(?)のアイコンにしてみた。
ちなみにデフォルトは下記の通り。
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: 35.681382, lng: 139.766084},
zoom: 8
});
}
以上。
■ 関連