GIS/markers:修訂版本之間的差異
出自六年制學程
(→範例程式) |
(→markers內參數) |
||
(未顯示同用戶所作出之4次版本) | |||
第 2 行: | 第 2 行: | ||
===範例程式=== | ===範例程式=== | ||
每一個地點用大括號包起來,所有的地點用中括號包起來。 | 每一個地點用大括號包起來,所有的地點用中括號包起來。 | ||
− | <pre> | + | <pre><meta content='text/html;charset=utf-8' http-equiv='Content-Type'> |
<script type='text/javascript' src='http://maps.google.com/maps/api/js?sensor=false'></script> | <script type='text/javascript' src='http://maps.google.com/maps/api/js?sensor=false'></script> | ||
− | <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/2. | + | <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js'></script> |
<script type='text/javascript' src='http://www.pittss.lv/jquery/gomap/js/jquery.gomap-1.3.3.min.js'></script> | <script type='text/javascript' src='http://www.pittss.lv/jquery/gomap/js/jquery.gomap-1.3.3.min.js'></script> | ||
<script> | <script> | ||
第 13 行: | 第 13 行: | ||
{ | { | ||
address:'台灣新北市板橋區新海路181號', | address:'台灣新北市板橋區新海路181號', | ||
− | html:{content:"<a href='http://jendo.org/ | + | html:{content:"<a href='http://jendo.org/wiki1231/' target=_blank>六年制學程</a>",popup:false} |
} | } | ||
], | ], | ||
第 19 行: | 第 19 行: | ||
}); | }); | ||
</script> | </script> | ||
− | <div align=center id='map' style='height:550px; width:900px;'>六年制學程</div> | + | <div align=center id='map' style='height:550px; width:900px;'>六年制學程</div></pre> |
− | </pre> | + | |
===說明=== | ===說明=== | ||
====如果字粘在一起==== | ====如果字粘在一起==== | ||
− | 去伺服器 | + | 去伺服器 jendo.org/~admin/ 資料夾中,下載 markerDemo2.html 或 markerDemo3.html 到你的平板電腦來用。 |
{{:GIS/基本/語法}} | {{:GIS/基本/語法}} | ||
====markers內參數==== | ====markers內參數==== | ||
*整個markers:後面用一個中括號把所有的點包起來。中括號裡面,每一組大括號是一個點。 | *整個markers:後面用一個中括號把所有的點包起來。中括號裡面,每一組大括號是一個點。 | ||
+ | *第一個 marker 為整張圖的中心點。 | ||
*每一個點內,諸參數如下: | *每一個點內,諸參數如下: | ||
#address:值為字串,故加引號,可用國名如「台灣」或地址如「台灣新北市三峽區三樹路2號」 | #address:值為字串,故加引號,可用國名如「台灣」或地址如「台灣新北市三峽區三樹路2號」 | ||
第 36 行: | 第 36 行: | ||
#*content:HTML碼 | #*content:HTML碼 | ||
#*popup:false不主動彈出;true主動彈出。 | #*popup:false不主動彈出;true主動彈出。 | ||
+ | #hideByClick:true點擊時popup的內容會顯隱交替。 | ||
#title:游標停住會顯示。 | #title:游標停住會顯示。 | ||
#draggable:true代表可拖動。 | #draggable:true代表可拖動。 | ||
#icon:字串,代表圖檔。 | #icon:字串,代表圖檔。 | ||
+ | |||
===作業=== | ===作業=== | ||
*將範例程式地點標示改成自己家。 | *將範例程式地點標示改成自己家。 | ||
*作第二個檔,將範例程式地點標示改成北投立祥商店。 | *作第二個檔,將範例程式地點標示改成北投立祥商店。 | ||
*將在上一點第二個檔中,由一個地點標示增加到兩個地點標示:立祥商店與法雨寺。 | *將在上一點第二個檔中,由一個地點標示增加到兩個地點標示:立祥商店與法雨寺。 |
2018年3月1日 (四) 23:42的最新修訂版本
範例程式
每一個地點用大括號包起來,所有的地點用中括號包起來。
<meta content='text/html;charset=utf-8' http-equiv='Content-Type'> <script type='text/javascript' src='http://maps.google.com/maps/api/js?sensor=false'></script> <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js'></script> <script type='text/javascript' src='http://www.pittss.lv/jquery/gomap/js/jquery.gomap-1.3.3.min.js'></script> <script> $(function(){ $('#map').goMap({ zoom:17, markers:[ { address:'台灣新北市板橋區新海路181號', html:{content:"<a href='http://jendo.org/wiki1231/' target=_blank>六年制學程</a>",popup:false} } ], }); }); </script> <div align=center id='map' style='height:550px; width:900px;'>六年制學程</div>
說明
如果字粘在一起
去伺服器 jendo.org/~admin/ 資料夾中,下載 markerDemo2.html 或 markerDemo3.html 到你的平板電腦來用。
括號、引號必須成對
- 所有字和符號都用「英數」、「半形」符號,不可以用全形符號。
- 所有的小括號、中括號、大括號、單引號、雙引號都要成對。
- 每一對大括號代表一個東西(物件),東西裡面可以包進去更小的東西,東西不一定要取名字。例如:
- 一張地圖。
- 一個覆蓋物。
- 一個經緯度座標點。
- 一個地點標示。
- 一個html指示。
- 每一對中括號裡面包一群相同的東西。例如:
- 一群 marker 包成一組,名字叫 markers ;
- 一群 overlay 包成一組,名字叫 overlays ;
- 一群 coord(經緯度座標)包成一組,名字叫 coords 。
- 每一對小括號中代表「函式」要作用的對象,現在先不必記它。
整張圖的性質
- 調整比例尺的性質:zoom:1~20。1比例尺最大,20比例尺最小。
- 標定整張地圖中心點位置的性質:
- latitude:緯度,十進位。
- longitude:經度,十進位。
- address:地址。如:以色列。
- 地圖種類:maptype:值加引號有四種選擇:
- ROADMAP:道路地圖
- SATELLITE:衛星空照圖
- HYBRID:道路與空照圖相疊加。
- TERRAIN:地形圖
- markers:各個地點標示
- overlays:各個覆蓋物
標點
- 性質的名稱和性質的「值」用「:」連接。
- 同一級或同一組的東西並列時,用「,」分開,但是最後一個性質或東西後面不可以加「,」,因為後面沒有東西了。
- HTML 中的樣式語法有點像 GIS 中性質語法,但前者是用「;」間隔開兩組樣式,後者是用「,」間隔開兩組性質或東西。
取得經緯度的方法
- android 上面必須使用 chrome 瀏覽器,不能使用預設瀏覽器。也不能使用地圖 app 。
- 地圖上某一點按久一點,模擬滑鼠右鍵,出現下拉式選單,按下「這裡有什麼?」
- 網址使用 maps.google.com.tw?ui=maps 得到 ms 介面。
- ms介面可以到「地圖研究室」啟動「經緯標記」。
- 長按地圖上一點,會跳出選單。選「標記經緯度」,可以標示經緯度。但標示點會偏,需要修正。
- PC板只要使用滑鼠,而且不限瀏覽器。
- 在要找的點,點擊滑鼠左鍵。就會出現該點的地址及經緯度。
- 網址列如打出:「https://www.google.com.tw/maps/@25.0246702,121.4566057,16z」可以指示圖中心點的經緯度及zoom的等級。
markers內參數
- 整個markers:後面用一個中括號把所有的點包起來。中括號裡面,每一組大括號是一個點。
- 第一個 marker 為整張圖的中心點。
- 每一個點內,諸參數如下:
- address:值為字串,故加引號,可用國名如「台灣」或地址如「台灣新北市三峽區三樹路2號」
- longitude:經度,十進位。如:121.459502
- latitude:緯度,十進位。如:25.025448
- html:放物件,內含:
- content:HTML碼
- popup:false不主動彈出;true主動彈出。
- hideByClick:true點擊時popup的內容會顯隱交替。
- title:游標停住會顯示。
- draggable:true代表可拖動。
- icon:字串,代表圖檔。
作業
- 將範例程式地點標示改成自己家。
- 作第二個檔,將範例程式地點標示改成北投立祥商店。
- 將在上一點第二個檔中,由一個地點標示增加到兩個地點標示:立祥商店與法雨寺。