telegram中文

如何将「Google动态地图」嵌入到博客或网页中?

       

2007/8/24自动更新: Google Maps 已开放「嵌入动态地图」到自己的网页

常常写美食日志或写游记的人,一定会常常需要将某个地点的的图秀给你的读者或朋友看,但一般情况下,,

可能只是抓个UrMap或Google Maps地图的URL连结,让大家连过去看。再费工一点的话,顶多是把网路地图抓张图下来,贴在你的网站或BLOG上。有没有更方便的方法,可以将整个动态的网路地图拉到自己的网站来显示呢?

有的!这下子真的有罗!以下介绍一个简单好用的网路地图telegram中文,让我们可以将自己选定的景点或地址嵌入到自己的网页或BLOG上。以後当你提到某的地点时,就可以直接让网友在你的网站上像使用Google Maps一样,用滑鼠拖、拉地图,找找方向。

继续阅读

 

Google动态地图范例:

 

以下介绍的这个网站,我猜他应该也是使用Google的「」来做的,该站站长将他弄成更简单方便的介面後一般使用者就可以直接按两下滑鼠取得程式码,并将Google动态地图嵌入到任何网页上。不用再费心的搞一堆「」程式码跟有的没的东西,就算是不会写程式的一般使用者,也可以轻易的在博客上贴地图唷。

网站名称:Embed Google ‘My Maps’
网站网址

在开始使用之前,先稍为介绍一下上面这个网站的大概用法他有两种主要用法:第一种是将你要显示的地点,设定好地图位置与大小後,直接嵌入程式码。

二、种的做法可让我们先在Google Maps上建好各自的「我的地图」,「我的地图」里面可镶入多个地点的说明、标题、划线跟画框区块等情况,不方便网友们较快的搜到方面或相关资料,听说还可还有Flickr相片等情况(这不确定唷)。如下先介绍首要种较简单的镶入动态Google地图的做法:

一、设定Google地图位置上、规格与工贝列

运营步骤其实很简单,仅仅通过中间步骤做就需要罗:

设定步骤:

1. 在「左边的地图」找到你要显示的地点
2. 按〔Set Zoom〕按钮(设定解答度)
3. 按〔Set Center〕按钮(设定地图中央点)
4. 勾选「控制列」与「中心点标示」功能
5. 设定地图宽度与高度(Size)
6. 将地图程式码贴到你的网站

第3步?? 首先,开启「Embed Google ‘My Maps’」网站,网站主要分两个区块,左边的地图是用来寻找地点用的你可以在左边地图用滑鼠拖拉、放大或寻找你要的地点。找到地点并按下定位按钮後,右边地图就会变成跟左边一模一样的画面,确认画面无误後,就可以使用右边地图下方的嵌入程式码将地图嵌入到你的网站中。

22-05-51

 

第2步? 如图,我们可以在左边地图中拖拉地图寻找你要的地点。在部份情况下,你也可以用左下方的「Address Search」功能来寻找你要的地点如输入「世贸」,再按下〔Recenter〕按钮,即可直接跳到台北101大楼旁边的台北世贸。(有些地点服务器不到的话,请用手动的)

22-07-26

 

第4步??在左边地图找到你要的地点後,按一下〔Set Zoom〕按钮,完成「地图解析度」的定位设定。设定好之後,以後当使用者开启该地图时,便会自动显示你指定的地图解析度,不用一直拉远或拉近(放大)来看。

22-08-51

 

第4步?? 接着再按一下〔Set Center〕按钮,完成地图中心点位置的设定。设定好之後以後当使用者开启该地图时,便会自动跳到你指定的那个地点,不用再花时间找路。

22-09-18

 

第5步?? 接着我们可以勾选「Map Control」跟「Mark Center」这两个选项,「Map Control」就是地图左上方的方向键与放大缩小地图的「+」跟「-」的telegram中文列。而「Mark Center」就是帮你在地图的中心点,也就是你指定的地址上放一个指标图,方便网友更清楚的看到你指定的地点。

22-09-52

 

第6步? 最後,如果你想调整地图呈现的大小的话,可以修改「Size」栏位中的数字,每做一次修改,都会直接显示在右边的地图中,让我们先行预览制作完成的地图样貌。确认无误後,再复制「Code」方框中的程式码,将这些程式码贴上到你的网站或博客中。范例就如同本站最上方的那个Google动态地图。

22-10-19

   

二、将Google动态地图嵌入到BLOG或网页中

注意!目前测试无名小站、Yahoo!奇摩博客均不支援「iframe」语法(其实也没关系,有支援正妹跟美女图就够了…)另外找到PIXNET(痞客帮)博客服务可以支援,所以下面就用PIXNET博客服务来示范。

第4步? 登入你的博客後,发表新文章时先将文章编辑器切换成一般编辑器(没有笑脸图示的那种),或者在进阶编辑器中按一下〔原始码〕按钮,切换原始码编辑模式来编辑文章。

22-29-37

 

第2步? 接着将刚刚的Google地图程式码贴上在文章中你想要显示的地方编辑好之後,再按下〔发表文章〕按钮。

22-30-21

 

第2步? 如图,你的文章中便会出现刚刚的地图,地图中会出现你指定的地点与标示。

22-31-12

更新:

另外一个更方便的嵌入地图制造器:

最後发布:11-03, 2013 十一点 5:56
相关资讯

访客留言:

25 Replies to “如何将「Google动态地图」嵌入到博客或网页中?”

  1. 感谢此文章发表者 一学即会
    不过原版文章看不懂
    此图制作完是否可以挂在一般商业公开网站公消费者免费查询!
    它要有授权我更看不懂
    有谁可以帮忙解惑?
    感恩不尽!

  2. 呵呵!台湾自产的UrMap也不错呦!!
    是否也可以支持一下台湾自己的东西呢?

    有兴趣可以参考上面连结,这是我把UrMap嵌入到我博客的画面
    我没有写教学文章,不过可以找UrMap API文件,都是中文,所以不用怕英文不好
    希望哪天有前辈也能做出一个方便使用者直接嵌入的语法

  3. 这个策略, 我前几天用过, 长期试成不了功,也许是因为我Blog里的另外JAVA挡快到, 虽然我懒得再去查, 即使要展现一大堆点, 这个也许 就要适用, 推荐My Map Plus. 请参考https://smantou.blogspot.com/2007/04/bloggergoogle-my-maps.html
  4. 嗯 好像不只一个@@
    1.该站站长将他弄成更简单方便的介面後,一般使用者
    2.(其实也没关系,有支援正妹跟美女图就够了…),另外找到PIXNET
    3.将刚刚的Google地图程式码贴上在文章中你想要显示的地方,编辑好

    不过..感谢手机分享教学呀…空着来试试看
  5. Urmap也提供这种功能
    不然大家可以去这个网站看看

    还是感谢您的提供罗
    可以的话改天也研究一下urmap把地图放在博客上喔

发布留言

telegram中文版 telegram中文 telegram下载 电报中文版下载 telegram中文电脑版 telegram中文下载 纸飞机中文版