Google地图未使用Geocode服务显示 [英] Google map does not show up using Geocode services

查看:82
本文介绍了Google地图未使用Geocode服务显示的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试使用地理编码服务,但由于某些原因,该地图未显示.当我检查开发者控制台时,它没有显示任何Javascript错误.

I am trying to use Geocode services but for some reason the map does not show up. When I checked the developer console it does not show any Javascript error.

这是Google地图以chrome显示的方式.

This is how the google map shows up in chrome.

<!DOCTYPE html>
        <html>
          <head>
            <title>Simple Map</title>
            <meta name="viewport" content="initial-scale=1.0">
            <meta charset="utf-8">
            <style>
              html, body {
                height: 100%;
                margin: 0;
                padding: 0;
              }
            </style>

            <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
            <script src="\div.js"></script>
        [![enter image description here][1]][1]
            <script>
            google.maps.visualRefefresh = true;

        var map;
        function initialize() {
            getCoordinates('287 West Center Street Utah', function(coords) {
                var mapOptions = {
                center: new google.maps.LatLng(coords[0],coords[1]),
                zoom: 8
                };
            map = new google.maps.Map(document.getElementById('map'), mapOptions);
            })
        }

        google.maps.event.addDomListener(window,'load',initialize);
            </script>
        </head>
        <body>
            <div id="map" style="height:100%"></div>        
          </body>
        </html>

div.js

    geocoder = new google.maps.Geocoder();
        function getCoordinates(address,callback) {
            var coordinates;
            geocoder.geocode({address : address} , function (results,status){
                coords_obj = results[0].geometry.location;
                coordinates = [coords_obj.nb, coords_obj.ob];
                callback(coordinates);
            })
        }

推荐答案

请勿使用Google Maps Javascript API v3的未记录属性.他们可以并且确实会在每个版本中进行更改. 始终使用记录的方法(.lat()、. lng()).

Do not use undocumented properties of the Google Maps Javascript API v3. They can and do change with every release. Always use the documented methods (.lat(), .lng()).

工作小提琴

代码段:

google.maps.visualRefefresh = true;

var map;

function initialize() {
  getCoordinates('287 West Center Street Utah', function(coords) {
    var mapOptions = {
      center: new google.maps.LatLng(coords[0], coords[1]),
      zoom: 8
    };
    map = new google.maps.Map(document.getElementById('map'), mapOptions);
  })

}

google.maps.event.addDomListener(window, 'load', initialize);
var geocoder = new google.maps.Geocoder();

function getCoordinates(address, callback) {
  var coordinates;
  geocoder.geocode({
    address: address
  }, function(results, status) {
    coords_obj = results[0].geometry.location;
    coordinates = [coords_obj.lat(), coords_obj.lng()];
    callback(coordinates);
  })
}

html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map" style="height:100%"></div>

这篇关于Google地图未使用Geocode服务显示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆