vue2-google-maps

Vue2-google-maps Api how to recenter map

こ雲淡風輕ζ 提交于 2021-01-29 06:33:45
问题 I am using the vue2-google-maps api with and I want to have a button that will change where the map is centered on. What code do I need to include to get the map re-centered. I've tried different functions such as map_center and mapCenter, but I just can't find the right one to use, even after many web searches. <div> <button @click="setCenter">Re-center</button> <br/> </div> <gmap-map :center="{ lat: 41.693206, lng: -86.228631 }" :zoom="12" style="width:100%; height: 65vh;" :options="{

custom marker for vue2-google-maps

可紊 提交于 2020-01-23 01:58:07
问题 I am trying to add my own images for a custom marker in vue2-google-maps without success. I know this is a bug and when I add an :icon="{url:'../assets/my_image'}" in tag the marker disappears. Has anyone managed to make it work? 回答1: You need to load the image in this case, like this: :icon="{ url: require('../../assets/img/marker-a.png')}" An example: <GmapMarker v-for="(m, index) in markers" :key="index" :ref="`marker${index}`" :position="m.position" :clickable="true" :draggable="true"

Custom marker over google map

牧云@^-^@ 提交于 2019-12-23 12:31:08
问题 Issue Details Default icon is showing and I am expecting a custom icon for marker. Am I missing anything in below code? I am using Laravel 5.6.12 and vue.js and trying to show custom icon in google map. My code is below in template. <template> <div> <gmap-map :center="center" :zoom="12" style="width:100%; height: 400px;"> <gmap-marker :key="index" v-for="(m, index) in markers" :position="m.position"> </gmap-marker> </gmap-map> </div> </template> JS Code <script> export default { data() {

My loop creates google map markers but it fails to set their position correctly so they do not get displayed. Hard coding the position works

霸气de小男生 提交于 2019-12-11 10:14:19
问题 For some reason, I am unable to see google map markers that should be placed based on the objects in my markers array after looping through it. If I were to create a second component and hard code the position, the marker appears. After inspecting the components created using the loop, I realized their position is set to undefined even though I set it to m.position any idea why? <template> <div class="wrapper"> <GmapMap :center="center" :zoom="zoom" :map-type-id="map" style="width: 100%;

custom marker for vue2-google-maps

﹥>﹥吖頭↗ 提交于 2019-12-04 14:50:12
I am trying to add my own images for a custom marker in vue2-google-maps without success. I know this is a bug and when I add an :icon="{url:'../assets/my_image'}" in tag the marker disappears. Has anyone managed to make it work? You need to load the image in this case, like this: :icon="{ url: require('../../assets/img/marker-a.png')}" An example: <GmapMarker v-for="(m, index) in markers" :key="index" :ref="`marker${index}`" :position="m.position" :clickable="true" :draggable="true" :icon="{ url: require('../../assets/img/marker-a.png')}" /> Just in case if you like to scale the size of the