Google マップを作成するカスタム ディレクティブを作成しました。
Vue.directive('gmap', {
inserted: function (el) {
return new google.maps.Map(el, {
center: { lat: -34.397, lng: 150.644 },
zoom: 8
})
}
})
<div v-gmap ref="map" style="height: 360px"></div>
それは機能し、地図を見ることができます。
次に、地図上にマーカーを描画したいので、Google マップ オブジェクトが必要です。
v-gmap ディレクティブから戻り値を取得できますか?
mounted () {
const map = this.$refs.map
const marker = new google.maps.Marker({
position: { lat: -34.397, lng: 150.644 },
map: map,
title: 'Hello World!'
});
}
うまくいきません。
map は単なる HTML 要素です。