文档章节

谷歌地图api的脚本文件无法用的解决办法

乱世中的单纯
 乱世中的单纯
发布于 2015/04/09 21:12
字数 509
阅读 15
收藏 0
点赞 0
评论 0

       这篇文章主要介绍了谷歌地图打不开的解决办法,本文给出了一个可以正常使用的谷歌地图调用案例,需要的朋友可以参考下。

      谷歌地图被中国防火墙封杀,所以不用直接引用http://maps.googleapis.com/maps/api/js?sensor=false&language=en这域名下的谷歌地图api,而是改为http://maps.google.cn/maps/api/js?sensor=false这个地址,google.cn在国内的域名没有被封杀,可以使用。

       注意:google.cn虽然可以使用,但是会输出部分js引用到google.com的资源,导致地图呈现会延时,所以不要将谷歌地图api放到你的内容前面,如head标签里面,而是放到内容或者html结束标签最后,防止你的页面内容一直是空白,浏览器无法显示内容。也不要用window.onload事件来绘制,要不谷歌地图显示不及时,因为要加载google.com的资源,而google.com资源被拦截,会导致知道请求超时(大概2分钟)才会绘制出谷歌地图。使用谷歌的回调参数来传递一个回调函数名称,经测试这样比使用window.onload事件快呈现出谷歌地图。

示例代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>网站引用谷歌地图打不开解决办法:使用google.cn</title> 
</head> 
  
<body> 
  
<div id="map_canvas" class="map" style="height: 350px;width: 500px;"></div></body> 
<script type="text/javascript" src="http://maps.google.cn/maps/api/js?sensor=false&callback=renderGoogleMap"></script> 
<script type="text/javascript"> 
  function renderGoogleMap() { 
    var geocoder = new google.maps.Geocoder(); 
    geocoder.geocode({ 'address': '广西桂林市中心广场' }, function (results, status) { 
      if (status == google.maps.GeocoderStatus.OK) { 
        map.setCenter(results[0].geometry.location); 
      } else { 
        alert("Geocode was not successful for the following reason: " + status); 
      } 
    }); 
    var mapOptions = { 
      zoom: 17, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 
  } 
</script> 
  
</body> 
</html>

 

本文转载自:http://www.jb51.net/article/53382.htm

共有 人打赏支持
乱世中的单纯
粉丝 10
博文 61
码字总数 36267
作品 0
广州
程序员
HTML5 Geolocation(地理定位)

HTML5 Geolocation(地理定位)用于定位用户的位置。 定位用户的位置 HTML5 Geolocation API 用于获得用户的地理位置。 鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可...

wybo521 ⋅ 2016/01/06 ⋅ 0

Highmaps网页图表教程之下载Highmaps与Highmaps的地图类型

Highmaps网页图表教程之下载Highmaps与Highmaps的地图类型 认识Highmaps Highmaps是Highcharts的姊妹框架,用来实现地图图表。它完全使用Javascript编写实现。其结构清晰,使用简单。开发人员...

大学霸 ⋅ 2015/08/13 ⋅ 0

编写最简单的android谷歌地图应用

文章转自:http://marshal.easymorse.com/archives/2512 有多简单呢?看,只是显示了一下地图而已: 想编写android谷歌地图应用,准备工作比编写其他应用要麻烦一些。因为: android谷歌地图...

无鸯 ⋅ 2011/09/07 ⋅ 1

iOS 设备判断是否安装相关地图(百度、高德。。。)

最近项目关于地图的,和朋友一起做的,他们用的高德地图,他做到半路有事,我来接手,结果我手机上没有安装高德地图,到我这边点击导航没啥反应,后来就查了一下,简单处理下,最终实现以下的...

JustEverOnce ⋅ 01/10 ⋅ 0

SenchaTouch2.1调用百度地图实例

SenchaTouch(以下简称st)里面使用的地图示例是采用的googleMap,但由于和谐社会的原因,google地图对我们的支持也是有心无力。在st的使用中也是经常出现无法加载googlemap的js。 但是没了谷...

罗盛力 ⋅ 2013/02/27 ⋅ 7

关于高德地图的点点滴滴

众所周知,高德地图是在谷歌退出中国市场后,大家比较喜欢用的地图之一,而鄙人接触高德地图也是在去年才开始。 今年因为项目的需要,开始对原有在高德地图上做的二次开发,进行了综合整理。...

xiaobo137 ⋅ 2016/01/27 ⋅ 0

各家地图公司地图开发API比较

各家地图公司地图开发API比较 一、谷歌地图API地址:http://code.google.com/apis/maps/ 基于Google Maps,能够使用 JavaScript 将 Google Maps 嵌入网页中。API 提供了大量实用工具用以处理...

睡得 ⋅ 2015/05/25 ⋅ 5

国内开发谷歌地图

@张攀 你好,想跟你请教个问题:看见你两年前发的一个提问 就是国内开发谷歌地图 各种型号手机又要翻墙又要安装谷歌服务 你后来怎么解决的 我用的高德地图 现在需要高德谷歌都有 我看六只脚那...

o0o89 ⋅ 2017/04/08 ⋅ 2

HTML5 Geolocation API和Google Maps API结合实现路线导航

HTML5提供了地理位置定位功能(Geolocation API),能确定用户位置,我们可以借助HTML5的该特性开发基于地理位置信息的应用。本文结合实例给大家分享如何使用HTML5,借助百度、谷歌地图接口来...

iNiL0119 ⋅ 2016/09/14 ⋅ 0

如何在网页中调用百度地图api

我想在木有提供地图接口的年代,前端工程师门要么只写上企业的具体地址,要么就是用一张标有自己位置的地图图片。但是现在不一样啦!为了增强用户体验,谷歌,甚至百度都很开放了,你可以在他...

Jokeny ⋅ 2014/08/30 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

个人博客的运营模式能否学习TMALL天猫质量为上?

心情随笔|个人博客的运营模式能否学习TMALL天猫质量为上? 中国的互联网已经发展了很多年了,记得在十年前,个人博客十分流行,大量的人都在写博客,而且质量还不错,很多高质量的文章都是在...

原创小博客 ⋅ 56分钟前 ⋅ 0

JavaScript零基础入门——(十一)JavaScript的DOM操作

JavaScript零基础入门——(十一)JavaScript的DOM操作 大家好,欢迎回到我们的JavaScript零基础入门。最近有些同学问我说,我讲的的比书上的精简不少。其实呢,我主要讲的是我在开发中经常会...

JandenMa ⋅ 今天 ⋅ 0

volatile和synchronized的区别

volatile和synchronized的区别 在讲这个之前需要先了解下JMM(Java memory Model :java内存模型):并发过程中如何处理可见性、原子性、有序性的问题--建立JMM模型 详情请看:https://baike.b...

MarinJ_Shao ⋅ 今天 ⋅ 0

深入分析Kubernetes Critical Pod(一)

Author: xidianwangtao@gmail.com 摘要:大家在部署Kubernetes集群AddOn组件的时候,经常会看到Annotation scheduler.alpha.kubernetes.io/critical-pod"="",以表示这是一个关键服务,那你知...

WaltonWang ⋅ 今天 ⋅ 0

原子性 - synchronized关键词

原子性概念 原子性提供了程序的互斥操作,同一时刻只能有一个线程能对某块代码进行操作。 原子性的实现方式 在jdk中,原子性的实现方式主要分为: synchronized:关键词,它依赖于JVM,保证了同...

dotleo ⋅ 今天 ⋅ 0

【2018.06.22学习笔记】【linux高级知识 14.4-15.3】

14.4 exportfs命令 14.5 NFS客户端问题 15.1 FTP介绍 15.2/15.3 使用vsftpd搭建ftp

lgsxp ⋅ 今天 ⋅ 0

JeeSite 4.0 功能权限管理基础(Shiro)

Shiro是Apache的一个开源框架,是一个权限管理的框架,实现用户认证、用户授权等。 只要有用户参与一般都要有权限管理,权限管理实现对用户访问系统的控制,按照安全规则或者安全策略控制用户...

ThinkGem ⋅ 昨天 ⋅ 0

python f-string 字符串格式化

主要内容 从Python 3.6开始,f-string是格式化字符串的一种很好的新方法。与其他格式化方式相比,它们不仅更易读,更简洁,不易出错,而且速度更快! 在本文的最后,您将了解如何以及为什么今...

阿豪boy ⋅ 昨天 ⋅ 0

Python实现自动登录站点

如果我们想要实现自动登录,那么我们就需要能够驱动浏览器(比如谷歌浏览器)来实现操作,ChromeDriver 刚好能够帮助我们这一点(非谷歌浏览器的驱动有所不同)。 一、确认软件版本 首先我们...

blackfoxya ⋅ 昨天 ⋅ 0

线性回归原理和实现基本认识

一:介绍 定义:线性回归在假设特证满足线性关系,根据给定的训练数据训练一个模型,并用此模型进行预测。为了了解这个定义,我们先举个简单的例子;我们假设一个线性方程 Y=2x+1, x变量为商...

wangxuwei ⋅ 昨天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部