Google maps component for vue with 2-way data binding
Questions tagged [vue2-google-maps]
54 questions
10
votes
2 answers
custom marker for vue2-google-maps
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?
user10043909
8
votes
3 answers
VueJS: Google Maps loads before data is ready - how to make it wait? (Nuxt)
This is my first VueJS project and I've got vue2-google-maps up and running but I've come across an issue when I attempt to connect the map markers to my site's JSON feed (using the Wordpress REST API), the Lat and Lng values are returning undefined…
AlxTheRed
- 505
- 6
- 23
5
votes
1 answer
Integrating Google Maps VueJS Components (vue2-google-maps) into a Laravel blade view
I am integrating a Google Maps Vue JS component into a Laravel application view using the vue2-google-maps npm package.
As per the npm package documentation I am loading the vue components from the npm package using:
import * as VueGoogleMaps from…
VerySeriousSoftwareEndeavours
- 1,713
- 3
- 31
- 57
5
votes
1 answer
Cross-Origin Read Blocking (CORB) when get data from Directions API using axios with Nuxt js
In my Nuxt project, I use vue2-google-maps library to create map and axios to get data from Map API.
I want to get distance between 2 location in google map, so i use Directions API:…
Michael
- 1,806
- 2
- 11
- 20
5
votes
1 answer
How to populate info window with html for google maps when using vue2-google-maps?
I'd like to make a custom Info Window for Google Maps when using vue2-google-maps. But so far, from what I know we can only add text to the info window. Is there any way to customize that with my custom HTML like below.
I want this to be done using…
Lucifer
- 1,069
- 4
- 16
- 26
4
votes
1 answer
Problem with vue2-google-maps with custom marker and icon resize, misplaced on zoom out
Vue.use(VueGoogleMaps, {
load: {
key: ''
},
});
new Vue({
el: '#root',
computed:{
icon(){
if (this.resized)
return {
url:"https://i.ibb.co/bdykLz4/test.png",
size: { width: 100, height:…
4
votes
3 answers
VueJS, ReferenceError: google is not defined
I have the following source code and I got also the following error when I try to instantiate a new var with google.maps ...:
google' is not defined
Many of the answers talked about loading the API script asyncronously before everything else, and…
Smix
- 69
- 1
- 1
- 7
4
votes
2 answers
Drawing a circle around a point in vue2-google-maps
I am using Vue to build a site that takes in some data and displays a google map with markers and circles around the points with the markers.
So far I can create the map with markers perfectly fine, however I have no idea what the proper way to…
wjmccann
- 502
- 6
- 18
4
votes
1 answer
Vue Router is duplicating entries in window.history in Safari
My App.vue has the following setup:
// App.vue
vue2-google-maps
…
sortofimport
- 796
- 6
- 12
4
votes
2 answers
Custom marker over google map
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.
…
Pankaj
- 9,749
- 32
- 139
- 283
3
votes
1 answer
is there a way to tell which markers are being clustered using vue2-google-maps and marker-clusterer-plus
Hello Everyone I would like to find out if there is a way to tell what custom markers are being clustered and also if there is a way to listen to the change of the markers being declustered on zoom in?
Angel D.
- 205
- 3
- 13
2
votes
1 answer
How to add polygon to a map
I am using Vue.js and vue2-google-maps to display a map and a polygon, but the function to show the polygon did not work. I am new to this framework.
I tried using the usual step from google maps tutorial using
map.data.add({geometry: new…
Adahuys
- 23
- 1
- 5
2
votes
1 answer
Can't import vue2-google-maps component to main.js
After installing vue2-google-maps with npm, I'm trying to import the component to my main.js. But I keep getting an error. I never had problem importing packages to main.js or to other .vue files.
Versions:
vue 2.6.10
vue2-google-maps@0.10.7
vue-cli…
botivegh
- 370
- 2
- 13
1
vote
0 answers
Catch error "this.$mapPromise.then is not a function" when use vue2-google-map with Nuxtjs
I use vue2-google-map in my Nuxtjs project. Every working well but I got some errors when trying to add my own component by using
MapElementFactory
I've read the document carefully and implemented coding like this
DirectionsRenderer.js
import {…
Beloyten
- 11
- 3
1
vote
0 answers
Vue 2 google-map won't render in storybook
I'm using vue2-google-maps package and I have a working map component.
Now I try to create a story for this component in storybook and I get errors like:
Unknown custom element
Unknown custom element
Unknown custom element…
tpliakas
- 1,118
- 1
- 9
- 16