ExtJS 2.x + Google Maps JavaScript API V3

   最近一段时间手头没有啥具体事情需要忙, 就抽空学习下ExtJS, 并把原先采用BCB6开发的一个配置工具上功能迁移集成到现有的Web平台上来; 刚好可以实践巩固下ExtJS, 其中有个区域配置功能打算把以前做的Google Maps也整合进来, 那Google Maps原先采用的是Google Maps JavaScript API V2, 需要注册申请API Key, 用起来不是那么方便; 现Google在2009上半年推出了不需要API Key的Google Maps JavaScript API V3版本, 打算顺便学习下. Google Maps 相关资料可以参考我原先整理的一篇博文Web开发系列 - GIS或者访问其官方网站Maps API 系列. 接下来介绍一下简单ExtJS 2.x + Google Maps JavaScript API V3集成应用 - 区域配置功能（演示地图基本功能、支持相关位置标记、拖动标记改变位置）.

 

1、我们先创建一个相关HTML页面gmap.html, 加入ExtJS依赖项,如相关css,js脚本文件

<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<script language="javascript" src="ext/adapter/ext/ext-base.js"></script>
<script language="javascript" src="ext/ext-all.js"></script>
<script language="javascript" src="ext/ext-lang-zh_CN-min.js"></script>

2、引入Google Maps JavaScript API 脚本文件（因为不是相关GPS应用，我们这里设置其相关参数sensor=false）

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&language=zh-CN"></script>

3、区域配置窗口相关JavaScript代码

4、最终呈现结果如图下，gmap.html文件下载