Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
173 views
in Technique[技术] by (71.8m points)

vue.js - How to display Google Maps with vue2-google-maps

I would like to use vue2-google-maps in my app but the map is not showing. I followed the documentation carefully on how to use it but the only thing I see is a blank white page instead of google maps. There are no errors in the console.

Here is my code:

<template>
  <gmap-map :center="{
      lat: 47.2736,
      lng: 16.0843
    }"></gmap-map>
</template>

<script>
export default {
  data: () => {
    return {}
  }
</script>

As you can see it's the simplest possible implementation but all I see is a blank white page. I inspected the page and I can see the vue-map container and all the elements but the map doesn't show in the app.

enter image description here

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Looks like I just had to add the zoom prop:

<template>
  <gmap-map :center="{
      lat: 47.2736,
      lng: 16.0843
    }" 
    :zoom="7"></gmap-map>
</template>

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...