Feature request: <q-map>
-
@walfin , thank you. This is similar to my code:
<gmap-map v-if="showmap" :zoom="mapZoom" :center="center" :style="mapHeight" :map-type-id="mapTypeId" ref="map" :options="{ zoomControl: true, mapTypeControl: false, scaleControl: true, streetViewControl: false, rotateControl: true, fullscreenControl: true, disableDefaultUi: true }" > <gmap-info-window :options="infoOptions" :position="infoWindowPos" :opened="infoWinOpen" @closeclick="infoWinOpen = false" > </gmap-info-window> <gmap-marker :key="index" v-for="(m, index) in markers" :position="m.position" :clickable="true" :draggable="true" :icon="{ url: imageStatic + 'favicon-32x32.png' }" @click="toggleInfoWindow(m, index)" ></gmap-marker> </gmap-map>
any chance you could share the code for looping all markers and how to set center from all markers?
-
-
i get:
Uncaught TypeError: Cannot read property 'maps' of undefined
from
new google.maps.LatLngBounds()
so i guess my boot file needs some attention
-
@PeterQF Put import {gmapApi} from ‘vue2-google-maps’; at the start of your script, computed:{google:gmapApi} in your component, then use this.google instead of google.
-
Tried that, it gave me:
SyntaxError (500) Unexpected token < Open: internal/modules/cjs/loader.js Unable to locate file source.
My boot file:
import Vue from 'vue' import * as VueGoogleMaps from 'vue2-google-maps' Vue.use(VueGoogleMaps, { load: { region: 'Sv', language: 'sv', key: 'XXXXXXXXXXXXXXXXXXXXXXXXX', libraries: 'places' }, installComponents: true })
also, @walfin , thank you for helping me.
-
@PeterQF wow that’s a strange error. Sure it didn’t come from somewhere else, like a Vue template? I don’t think there would be any < in your code otherwise.
-
I don’t think so it works fine without:
<script> // import { gmapApi } from 'vue2-google-maps'
maybe i misunderstood you, the import is in my map component vue and not in my boot file?
-
i get the feeling that i need to do something like export in my boot file to be able to use google.maps.XXXXX in my components?
-
No you don’t. The import is in the component vue file and not the boot file. That’s how I got it working for mine.
-
Maybe you already solved, but if you wanna use google.maps.XXXXX you should first import gmapApi in your component, and then use a computed like google: gmapApi, or add something like const google = window.google