应用工具
资讯
>GPS频道>GPS试用>

如何为个人网站添加谷歌地图服务

如何为个人网站添加谷歌地图服务

用手机阅读
扫一扫,在手机上阅读本文
收藏文章

收藏成功

查看我的收藏>>
2008-10-29 17:01:14来源:zol类型:转载编辑:

  笔者最近搞了一个域名,准备做个博客也随潮流一把。见到Google Maps上的地图十分方便醒目,如果能把这个地图集成到个人网站中既方便了自己也方便了来访的朋友。而我们所需的这一切Google早已经提供相应的API,剩下来的只是按部就班的去做了。

  下面明确一下需求:在个人网站中添加Google Maps服务。向下面的谷歌地图一样,把它做到自己的网站上。(效果与Google Maps浏览地图方式一样,支持拖拽、放大等。)


技巧:如何为个人网站添加谷歌地图服务

Google Maps

  好的,需求已经明确。下面就请随笔者一步一步实现吧。

  在正式开始之前,首先需要具备以下条件:

  1,具备一个属于自己的域名,如http://www.yourname.com
  2,具备该域名下空间的文件管理权限,如FTP等。
  3,一个Google帐户,没有可以去http://www.google.com注册

  首先,登陆Google主页登陆用户账号,接着进入Google 地图 API官方网站[点击进入]找到“注册以获得API密钥”。Google地图API允许用户将Google 地图嵌入到自己的网页中,但一个地图API密钥只针对一个网络服务器上的一个“目录”有效。


技巧:如何为个人网站添加谷歌地图服务

技巧:如何为个人网站添加谷歌地图服务
点击查看大图

  所以,如果我们要使用Google地图的API服务,就必须申请密钥。这里需要提前设计好自己的“目录”。什么是“目录”呢?就是你网站域名下的一个“文件夹”。

技巧:如何为个人网站添加谷歌地图服务
利用FTP客户端在域名根目录下创建“google”目录

  如笔者的域名是http://www.wangziyi.com ,那么笔者可以在域名根目录下建立一个名为“google”(这里最好全部使用小写)的文件夹,所以在注册Google 地图 API密钥时要输入的网站就是:http://www.wangziyi.com/google

目录建立完毕之后,点击注册Google 地图 API页面上的“生成API密钥”


技巧:如何为个人网站添加谷歌地图服务

  生成之后将显示:

技巧:如何为个人网站添加谷歌地图服务
点击查看大图

  上图即是利用http://www.wangziyi.com/google 目录生成的密钥页面以及一个参考基本地图代码。

注:该密钥与申请时注册的域名是相互关联的,其他域名用户是无法使用的。同时Google 地图 API注册页面也指出了一些注意事项:

技巧:如何为个人网站添加谷歌地图服务
点击或登陆官方页面查看

  下面我们可以先使用“密钥生成页面”中的简单Google地图 HTML代码创建到http://www.wangziyi.com/google 下的index.html中进行测试。


技巧:如何为个人网站添加谷歌地图服务

基本地图代码

  这里要说明的是,代码中包含刚刚生成的密钥。

技巧:如何为个人网站添加谷歌地图服务
代码复制到记事本中保存为index.html或index.htm文件

  接着利用FTP上传到http://www.wangziyi.com的google文件夹中

技巧:如何为个人网站添加谷歌地图服务
上传到google目录

随后就可以访问http://www.wangziyi.com/google 目录查看是否可以正常显示。


技巧:如何为个人网站添加谷歌地图服务

测试可以正常显示地图

  到此,已经可以成功使用Google 地图 API,剩下的就是继续深造学习一些如“创建KML站点地图”、“显示Google卫星地图”、以及“显示谷歌中国地图”等技巧。受于篇幅限制,其他技巧将于近期发布,敬请关注中关村在线 GPS频道。同时也欢迎更多的网友通过留言或邮件与笔者交流、探讨Google Maps API相关技术,共同进步!

问卷调查:五大人群 对车的8大偏爱相关阅读

比预售便宜3万,然后呢?艾尼氪V想用“终身兜底”回答一个更难的问题
比预售便宜3万,然后呢?艾尼氪V想用“终身兜底”回答一个更难的问题
新能源车越来越便宜,这是事实。但一个被忽略的真相是:买车那一刻省下的钱,可能在用车第三年、第五年,以另一种方式还回去。..
新车新闻
李勃:越南重卡市场进入增长期 2026年中国品牌销量预计将达6万辆
李勃:越南重卡市场进入增长期 2026年中国品牌销量预计将达6万辆
东风柳州汽车有限公司进出口公司副总经理李勃发表题为“驭变拓新破局致远—把握越南重卡市场变革下的时代机遇”的演讲,分享了越南商用车市场的发展趋势及中国品牌出海面临的机遇与挑战。..
行业新闻
ThreepolBoonyamarn:泰国汽车出口占比升至60% “3030”目标持续推进
ThreepolBoonyamarn:泰国汽车出口占比升至60% “3030”目标持续推进
泰国汽车研究院(TAI)执行副主席ThreepolBoonyamarn(特里蓬·布尼亚曼)从产业发展历程、新能源汽车市场、政策体系、产业链建设及人才与技术升级等方面,介绍了泰国汽车产业当前的发展情况及..
行业新闻
限时权益价9.99万起 艾尼氪V正式上市
限时权益价9.99万起 艾尼氪V正式上市
9月29日,北京现代旗下全新B+级纯电轿跑——艾尼氪V正式上市,共推5款车型,官方指导价区间为10.99-13.99万元,限时权益价为9.99-13.19万元,新车提供整车终身质保,三电保换保赔等保障..
新车新闻
长城大狗HEV混动版上市:把10万级方盒子拉进混动主流
长城大狗HEV混动版上市:把10万级方盒子拉进混动主流
9月28日,长城汽车旗下大狗HEV混动版正式上市。与常规新车发布会不同,这场发布没有舞台、没有聚光灯,取而代之的是一支从清晨开到深夜的车队——超18小时不间断直播。..
新车新闻
全国
收藏 评论
按字母分类:
ABCDEFGHIJKLMNOPQRSTWXYZ0-9