`
gty509
  • 浏览: 55619 次
  • 性别: Icon_minigender_1
  • 来自: Bangkok
文章分类
社区版块
存档分类
最新评论

google Api javascript 动态加载

阅读更多
google 动态加载api 不仅仅可以加载自产的ajax模组,同时也可以加载众多流行的三方模组,如jQuery, dojo,yui等等。本文将对此动态加载方式做一个简单介绍。

这种动态加载方式很简单,首先包含google动态加载api本身的.js文件,代码如下:
<script type="text/javascript" src="http://www.google.com/jsapi"></script>


然后用google.load(模块名字,版本号)加载模组比如:
google.load("maps","2"); //加载gmap
google.load("search","1");//加载search
google.load("jquery","1.3.2");//加载jquery
google.load("dojo","1.3.0");//加载dojo


最后一步很重要,我们要运行google.setOnLoadCallBack(你的初始函数)。为什么要运行这个函数呢?因为你自己的初始函数里如果调用了尚未加载完成的模块中的代码,浏览器就会报错,你的ajax程序就中断停止运行了。

一个完整的实例是:
<html>
  <head>
    <script type="text/javascript"
            src="http://www.google.com/jsapi?key=ABCDEFG"></script>
    <script type="text/javascript">
      google.load("maps", "2");
      google.load("search", "1");

      // Call this function when the page has been loaded
      function initialize() {
        var map = new google.maps.Map2(document.getElementById("map"));
        map.setCenter(new google.maps.LatLng(37.4419, -122.1419), 13);

        var searchControl = new google.search.SearchControl();
        searchControl.addSearcher(new google.search.WebSearch());
        searchControl.addSearcher(new google.search.NewsSearch());
        searchControl.draw(document.getElementById("searchcontrol"));
      }
      google.setOnLoadCallback(initialize);
    </script>

  </head>
  <body>
    <div id="map" style="width: 200px; height: 200px"></div>
    <div id="searchcontrol"></div>
  </body>

</html>


下面的url列出了google loader api 可以加载的模组及其版本号。
加载自产的组件:
http://code.google.com/apis/ajax/documentation/
加载第三方组件:
http://code.google.com/apis/ajaxlibs/documentation/



分享到:
评论
3 楼 闲云无心 2009-05-06  
gty509 写道
闲云无心 写道
google第三方类库的jsapi有个隐患,浏览用户在google上搜索什么东西被墙掉,在这阶段里jsapi会同样不可用


jsapi不工作,你是说在加载前,还是加载后。模块加载完成后,模块就和jsapi无关了。比如如果你已经成功加载了dojo模组,而你的search模组挂起了,dojo模组还是可以运行的。但是如果你的search模组挂起之后,你的代码还想动态加载其他模组就有可能失败。

当然如果你的浏览器设置成javascript一旦出错,就终止javascript编译器的工作,那么你所有的javascript都在出错后停止运行。

你理解错我意思了,我说的不是js本身问题,而是用户在google搜索敏感内容被屏蔽几分钟,这之后打开或者刷新你的页面,而你的页面用到的是jsapi托管的第三方类库,就有点问题了


可能你没碰到过这种情况

举个例子

访问http://www.google.com/jsapi是没问题的

但是一旦客户之前google了什么敏感的关键字被墙一段世间

譬如搜索个phproxy,然后随便点个连接
http://www.google.com/url?sa=t&source=web&ct=res&cd=4&url=http%3A%2F%2Fbbs.netbirds.com%2Fproxy%2F&ei=UhgBSsuDGYj4tAPpsZnsBQ&rct=j&q=phproxy&usg=AFQjCNGefrJjwHpk-x_HShQuazW4JwDpBA&sig2=2oxvxwTv5xZHNmLBeHgFWw

之后再访问 http://www.google.com/jsapi,就会页面载入错误

web应用本身需要的第三方类库还是不要太依赖google jsapi了
2 楼 gty509 2009-05-06  
闲云无心 写道
google第三方类库的jsapi有个隐患,浏览用户在google上搜索什么东西被墙掉,在这阶段里jsapi会同样不可用


jsapi不工作,你是说在加载前,还是加载后。模块加载完成后,模块就和jsapi无关了。比如如果你已经成功加载了dojo模组,而你的search模组挂起了,dojo模组还是可以运行的。但是如果你的search模组挂起之后,你的代码还想动态加载其他模组就有可能失败。

当然如果你的浏览器设置成javascript一旦出错,就终止javascript编译器的工作,那么你所有的javascript都在出错后停止运行。
1 楼 闲云无心 2009-05-06  
google第三方类库的jsapi有个隐患,浏览用户在google上搜索什么东西被墙掉,在这阶段里jsapi会同样不可用

相关推荐

    ArcGIS API for JavaScript3加载谷歌地图

    本文将深入探讨如何使用ArcGIS API for JavaScript 3.23版本加载并集成在线的谷歌地图,以及展示谷歌地图的影像和标注。 首先,我们要了解ArcGIS API for JavaScript的核心概念。这是一个基于Web的开发库,由Esri...

    ArcGIS API for Javascript 4.10加载谷歌地图

    总结起来,通过ArcGIS API for JavaScript 4.10,我们可以利用自定义扩展模块来加载谷歌地图,提供给用户一个熟悉且功能强大的地图界面。这个过程涉及到JavaScript编程、图层扩展、地图服务接口的使用等多个方面,...

    ArcGIS api for javascript 3.21版本加载高德地图

    在本文中,我们将深入探讨如何使用ArcGIS API for JavaScript 3.21版本来加载高德地图。ArcGIS API是一款强大的工具,它允许开发者在Web应用程序中集成地理信息系统(GIS)功能,包括地图显示、图层操作、地理编码、...

    js-api-loader:动态加载Google Maps JavaScript API脚本

    动态加载Google Maps JavaScript API脚本。 这从 npm包中获得灵感,但使用ES6,Promises和TypeScript对其进行了更新。 该软件包的早期版本可在但在此处已重命名为软件包 。 安装 通过npm作为软件包。 npm i @...

    asp.net动态加载JavaScript树

    ASP.NET动态加载JavaScript树是一种常见的前端交互技术,用于在网页中构建可扩展的、动态的树形结构。这种技术结合了后端ASP.NET的强大处理能力和前端JavaScript的灵活展示,为用户提供了良好的交互体验,尤其适用于...

    Google Maps JavaScript API V3 详细教程

    - Google Maps API V3 是一个基于JavaScript的库,允许开发者将动态地图集成到网页中。 - API 提供了丰富的功能,包括地图显示、标记、路径绘制、地理编码、街景视图等。 2. **“世界,您好”——创建基本地图** ...

    Google_Maps_JavaScript_API_V3_教程

    ### Google Maps JavaScript API V3 教程 #### 引言 Google Maps JavaScript API V3 是一个功能强大且灵活的地图服务接口,允许开发者轻松地将交互式地图集成到他们的网站或应用中。相比于之前的版本,V3 提供了更...

    ArcGIS API 4.10加载谷歌地图

    一种常见方法是使用Google Maps JavaScript API来创建地图,然后将其作为一个动态图层添加到ArcGIS地图中。这涉及到跨域请求和地图坐标系统的转换,因为ArcGIS通常使用WGS84坐标系统,而谷歌地图使用 Mercator 投影...

    google地图 API

    1. 地图显示:谷歌地图API可以通过JavaScript API在网页上加载地图。开发者可以自定义地图的样式、缩放级别、中心点,甚至切换卫星、地形或混合模式。通过简单的HTML和JavaScript代码,就可以将地图无缝地融入到任何...

    google地图api文档

    加载 Google 地图 API 需要在 HTML 文件中添加一行 JavaScript 代码,用于加载 Google 地图 API。例如:&lt;script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"&gt;&lt;/script&gt; 3. 加载 Google 地图 ...

    Google 地图 JavaScript API 示例 简单地址解析

    Google地图JavaScript API是开发人员用于在网页上集成Google地图的强大工具。它提供了丰富的功能,包括地图显示、标记定位、路线规划等。在这个示例中,我们将深入探讨如何使用JavaScript API进行简单的地址解析。 ...

    Google Api之Google maps代码

    本篇将详细讲解基于JavaScript的Google Maps API的使用,以及如何通过提供的示例代码进行实践。 首先,`Google Maps JavaScript API`是Google Maps的核心部分,它允许我们用JavaScript编写交互式的地图。在使用前,...

    google离线地图API包 + 地图数据

    Google Map API V3是Google提供的一个JavaScript库,用于在网页上嵌入交互式地图。这个API提供了丰富的功能,如定位、路线规划、地图缩放和平移等。在这个压缩包中,包含了使用Google Map API V3来实现离线地图的...

    Google_Maps_API_V3.rar_Google Maps api v3_谷歌地图

    学习和掌握Google Maps API V3,需要对JavaScript有一定的了解,同时,理解地理坐标系统和网络请求机制也是必要的。在实际项目中,还需要考虑API调用限制和性能优化,以及如何结合后端数据来实现更复杂的功能。总的...

    google earth api

    通过以上知识点,你可以开始构建自己的交互式地理应用,无论是展示地理位置信息,还是创建动态的地理模拟,谷歌地球API都提供了一个强大的平台。不过,考虑到API的退役状态,建议在新项目中探索更现代和可持续的解决...

    Qt加载百度地图和谷歌地图

    对于动态地图,可以使用JavaScript API,如: ```cpp QString baiduMapJsApi = "https://api.map.baidu.com/api?v=2.0&ak=YOUR_BAIDU_API_KEY&callback=initBaiduMap"; ``` 谷歌地图的API URL类似,但需要替换为...

    delphi调用GOOGLE API

    而谷歌API,特别是谷歌地图API,为开发者提供了丰富的地图功能,如定位、路线规划、地理编码等。 首先,要调用谷歌API,你需要注册一个谷歌开发者账号并获取API密钥。这是所有谷歌API调用的基础,因为每个请求都...

    google-js-api-client-wrapper:处理 google js api 客户端的加载和 api 客户端的加载,包括云端点。 需要 jQuery

    这个库主要负责管理和优化Google JavaScript API客户端的加载过程,确保应用程序能够有效地与Google的API进行通信。 首先,我们来详细了解一下Google JavaScript API客户端。它是Google提供的一套JavaScript库,...

Global site tag (gtag.js) - Google Analytics