檢視六年制學程/02/2015.02.26 的原始碼

[[分類:六年制學程/02]]
==晨課==
==SVG 和 GIS 進階==
===準備工作===
*windows
*#瀏覽器：firefox
*#檔案上下傳：filezilla
*#文字編輯器：Emeditor
*android
*#瀏覽器：HTML Viewer
*#檔案上下傳：DSfile
*#文字編輯器：檔編輯器、文本編輯器、文件大師

復習「伺服器」、「客戶端電腦」、「檔案在伺服器供大眾瀏覽」、「檔案在客戶端電腦編輯、修改」、「伺服器為上，客戶端電腦為下，用檔案傳輸軟體將檔案上傳下載」等觀念。

檔名全班統一約定：
*gistest0.html，抄襲複製示範檔案。
*gistest1.html，自己家的 GIS 練習。
*gistest2.html，練習貼上縮小版瀑布的 GIS 練習。
*gistest3.html，練習貼上縮小版馴養動物的 GIS 練習。
===掃描器使用===

===觀察與複製===
本次練習以將 SVG 圖(瀑布)嵌入 GIS 為主，不必實作 SVG 圖之縮小
#觀察「jendo.org/~admin/Africa.html」或「jendo.org/~丁志仁/Africa.html」。看維多利亞瀑布。
#看原始碼：[http://www.ifreesite.com/viewsource http://www.ifreesite.com/viewsource]，了解 GIS 的 marker 如何更換圖示。
#注意：SVG 標籤中有兩種顯示指示：
#*width 及 height 這種指示的圖可以做為 GIS 的嵌入圖。
#*viewbox 這種指示的圖不能做為 GIS 的嵌入圖，須改為 width 、 height 指示。
#複製原始碼至自己的檔案 gistest2.html 。
#了解由<table><tr><td><img src=http://jendo.org/~admin/pool.svg width=250px /></td><td> 到 </td><td><img src=http://jendo.org/~admin/waterfall1.svg width=250px /></td><td> 再到 </td><td><img src=http://jendo.org/~admin/waterfall2.svg width=32px/></td></tr></table> 
#inkscape 剪除多餘部分的練習
#svg 縮小解說：標籤 g 加上 transform='scale(橫向倍率,縱向倍率)'
#貼入 GIS 練習

===用自己的馴養動物貼到 GIS===
本次重點在將自己的 SVG 圖縮小，新生的馴養動作在此： <img src='/~邱申晴/蜜蜂.svg' width='100px' /> 。
#找到自己的 SVG 圖。在「該作的事/馴養動物GIS」中。
#加工縮小：
#*下載回客戶端電腦
#*以標籤 g 把動物包起來
#*標籤 g 加上 transform='scale(橫向倍率,縱向倍率)' 
#*調整 svg 標籤的 width 數值，和 height 數值 
#找到馴養動物最初被馴養成功的經緯度。
#將縮小版的馴養動物貼到自製的檔案 gistest3.html 。