Пользовательский маркер на карте Google - PullRequest
Новая
       40

Пользовательский маркер на карте Google

0 голосов
/ 06 июня 2018

Сведения о выпуске

По умолчанию отображается значок, и я ожидаю пользовательский значок для маркера.Я что-то упускаю из приведенного ниже кода?

Я использую Laravel 5.6.12 и vue.js и пытаюсь показать пользовательский значок на карте Google.Мой код ниже в шаблоне. 

<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 

<script>
    export default {
        data() {
            return { 
                center: { lat: 30.2457963, lng: 75.84207160000005 },
                markers: [],
                places: []
            }
        },
        created() {
            this.markers.push({ 
                 position: this.center, 
                 icon: 'https://maps.google.com/mapfiles/kml/shapes/parking_lot_maps.png' 
            });
        },
        methods: {

        }
    }
</script>

Ответы [ 2 ]

0 голосов
/ 02 декабря 2018

У меня была похожая проблема, и решение ниже работает.Это так же просто, как добавить :icon="{ url:'./path-/to/-icon.png'}" в gmap-marker.Например, ваш скрипт должен выглядеть так: 

<gmap-marker
     :key="index"
     v-for="(m, index) in markers"
     :position="m.position"
     :icon="{ url:'https://maps.google.com/mapfiles/kml/shapes/parking_lot_maps.png'}">
</gmap-marker>
0 голосов
/ 12 июня 2018

Вы пробовали это?Значок привязки к элементу gmap-marker 

<gmap-marker
  :key="index"
  v-for="(m, index) in markers"
  :position="m.position">
  :icon="m.icon"   
</gmap-marker>
...