目前分類:圖像影像 (6)

瀏覽方式: 標題列表 簡短摘要
  • Oct 07 Mon 2013 15:55
  • b

 

---------------------------------

Title

 

空大 小熊 發表在 痞客邦 留言(0) 人氣()

  • Oct 07 Mon 2013 09:23
  • a test

!-- A basic input -->

空大 小熊 發表在 痞客邦 留言(0) 人氣()

    This is object Only using edu, and don't work to business or other ways.

School name:National Open University http://www.nou.edu.tw
Department of Business: http://www.nou.edu.tw/~eng/Links/Links.htm
Student name: wen xiong

 fist words ... loading ....then photo

24_day7_14pm  

圖上的颱風是強颱丹娜絲

(中央氣象局7日上午0830解除了輕度颱風<菲特>的警報)

 

菲特中颱.png

14_天氣查詢.png 

Ani Loading.....

19_ani_day508amday602pm.gif  

 

(資料來源:中央氣象局2013_10_05) 星期六day5_下午的狀態,3:30雲圖/下午路徑/04雨量累積/日雨量

(資料來源:中央氣象局2013_10_06) 星期日day6_上午的狀態,:08AM雲圖;PM雲圖/下午路徑/下午雨量累積/日雨量

(資料來源:中央氣象局2013_10_07) 星期日day7_上午的狀態,:10AM雲圖/路徑圖

前兩天的雨量住要落在<新竹縣的尖石/玉峰鄉、桃園縣復興鄉、新北市的烏來>

前五名雨量縣市,最高的約在533-400毫米

<天氣動態>

摘要:day 6日下午2點位置,台北東北方約200KM的海面上,方向>往西北西,速度18-15KM/h, 位置北26.3度/東經122.9度,

半徑250KM

 

作法:

>上傳一張.png或 .gif 圖檔,所有的網路地圖圖檔都要上傳,最好先編好再上傳,更改超連時就很好用了。

>在部落格點選html, 加入圖檔的w和H

>最後再將在GIMP上做好的網路地圖圖檔(先開啟.png, 接著到濾鏡_點選網路地圖_開啟舊檔中的html檔,在功能選單上

選示_原始檔_複製區域 area.....後面的方塊座標及hera:超連結_)

修正在GIMPalt 為 title,才會顯現超連結的小標籤為正確連結位置,不然他會抓部落格預設的 title,

以直觀的(圖標)替代(文字)作為超連結(連到網站外或是部落格內部的連結點)是觸控式電腦或網際網路的作法。

也許受到部落格幅寬的影響(網站預設的圖片仍多以左右橫幅為準則較多),但似乎也可以考慮改為直幅式,

中央氣象局為例:修改後圖標超連結

<area title="交通部中央氣象局" shape="rect" coords="11,12,83,57" href="http://www.cwb.gov.tw/V7/observe/" />

限教育用>空大為範例:

更正前<area shape="rect" coords="94,2,154,63" href="http://www.nou.edu.tw" alt="國立空中大學" />

更正後<area  title="國立空中大學" shape="rect" coords="94,2,154,63" href="http://www.nou.edu.tw"/>

限教育用>

<img title="菲特中颱.png" src="http://pic.pimg.tw/assf0102/1380949774-1813281762.png"  width="674" height="536" usemap="#map" border="0" /></span></span></p>
<p><map name="map">
 <!-- #$-:Image map file created by GIMP Image Map plug-in -->
 <!-- #$-:GIMP Image Map plug-in by Maurits Rijk --> <!-- #$-:Please do not edit lines starting with "#$" -->
<!-- #$VERSION:2.3 --> <!-- #$AUTHOR:National Open University student of business    -->

<area title="交通部中央氣象局" shape="rect" coords="11,12,83,57" href="http://www.cwb.gov.tw/V7/observe/" />
 
<area title="NOU國立空中大學" shape="rect" coords="94,2,154,63" href="http://www.nou.edu.tw" />

                   

空大 小熊 發表在 痞客邦 留言(0) 人氣()

  

  tw.png

 

   <!-- #$AUTHOR:NationalOpen University student of business ->    Klcg gov        abc456??? http://www.taipei.gov.tw/";           

<img src="http://pic.pimg.tw/assf0102/1380949774-1813281762.pngwidth="513" height="672" usemap="#map" border="0" /></span>
</p>

<p><map name="map">

-------

中文的意思:

第一段語法

<img src= (以這個圖檔路徑為準="http://XXXXXXXXX-yyyyyyyy.png",

以這個例子為例:先插入之前上傳的tw.png 圖檔,接者,選取圖檔>按右鍵>內容_出現方塊,複製>網址(URL)後面http://xxxxxx-yyyy.png, 接者把尺寸打進去如:width="xxx" height="xxx" border通常預設為="0", 暫且翻成使用地圖的定義usemap="#map"),完成。簡言之,告訴電腦程式,這個要超連結的電腦圖檔放在哪,圖檔的寬高的尺寸,最後定義定義他是#地圖,/反斜線代表結束設定。

第二段語法

<p>印出

<map name="map"> 地圖名稱="地圖",意思要程式是找出前段設定的中usemap="#map"

 

-------

 

注意:在你的圖片資料夾裡必須先存有tw.png的原台灣圖檔,否則html無法正常開啟,因為抓不到原圖圖檔,程式無法呼叫,

html只能看到空白圖檔,把原圖檔tw.png存到與html相同資料夾內,就可以抓到圖做出超連結了,po上後,標籤中文不顯示或亂碼,
改成英文就OK了。

1>上傳一張網路地圖tw.png到pixnet相簿裡

2>發表文章,插入圖片

3>點選Html>檢視語法>先刪除原來圖的影像圖片<p><img href="pixnet/010101010">

4> 加入(複製貼上) 座標值,及超連結(例子:基隆、台北、台中)

5>中文字不顯現,可以改用英文字

6> 原部落格的tag標籤不見了,後加的Alt也無法顯現

 


 

<img src="tw.png" usemap="#map" border="0" height="672" width="513">
<map name="map">

 

<area shape="rect" coords="439,25,484,44" alt="Klcg gov" href="http://www.klcg.gov.tw/">
<>
<area shape="rect" coords="223,206,266,234" alt="abc_台中市政府" href="http://www.taichung.gov.tw/">
</map>

 

空大 小熊 發表在 痞客邦 留言(0) 人氣()

GIMP2.6軟件

GIMP>濾鏡_網頁/影像地圖編輯器,在編輯完成後另存新檔為 001xx.html

打開之後,發現圖檔是空白,無法顯現圖檔和超連結時,那是<原始檔>亂掉了,

以下是說明如何更新亂碼

>開啟GIMP2.6

>從資料夾裡開啟一個.png檔(可攜式網路圖型),

開始編輯,選擇要超連結的位置的圈選形狀(方或圓)和填上網址(做超連結),

>存檔>選(另存新黨) nou123.html

>到檔案位置上(c:xxxxxx)找到剛存檔的 nou123.html,無法做超連結

>go>上面的>檢視_原始檔>把原始檔複製下來,

接著到電腦左下>開始>記事本(建立及編輯文字檔),貼上剛複製的原始碼

 

<img src="tw.png" width="513" height="672" border="0" usemap="#map" />

<map name="map">

<!-- #$-:Image map file created by GIMP Image Map plug-in -->

<!-- #$-:GIMP Image Map plug-in by Maurits Rijk -->

<!-- #$-:Please do not edit lines starting with "#$" -->

<!-- #$VERSION:2.3 -->

<!-- #$AUTHOR:COMPAQ -->

上面的語法不動,下面的更正

部分亂碼的顯示出現在在座標位置 href="前xdnw口

在座標位置 coords="439,25,484,44"後面,修正如下

 alt="台北市政府" href="http://www.taipei.gov.tw/" /

 

正確的顯示方式應該是:如下:

<area shape="rect" coords="439,25,484,44" href="http://www.klcg.gov.tw/" />

<area shape="rect" coords="379,40,421,65" alt="abc456" href="http://www.taipei.gov.tw/" />

<area shape="rect" coords="223,206,266,234" alt="abc_台中市政府" href="http://www.taichung.gov.tw/" />

</map>

>存回去原nou123.html,選擇<取代原檔>

從新打開檔案nou123.html

 

PS

area shape="rect" --區域形狀是矩形

coords="439,25,484,44" 表示要連結的座標位置的x和Y軸的(x=439,25,Y=484,44)

 alt="台中市政府" --表示當出現超連結時所要出現的文字對方方塊

href="http://www.klcg.gov.tw/" /--表示超連結的網址

 

參考範例:

http://mail.mcjh.kl.edu.tw/~lin/teach/gimp/map/map.htm

 

空大 小熊 發表在 痞客邦 留言(0) 人氣()

動畫GIF圖檔練習,可以先從中央氣象局的小圖檔來練習

雨量圖示我選擇,GIMP圖像處理軟件具有這種功能,在功能列<濾鏡>下拉式選單中選單中有<播放>

最後是要存成GIF的動畫選項中,而不是一般的.jpg檔名或.gif檔名,否則無法成為動畫檔。

pixnet 部落格也支援用戶可以做這種GIF檔,來豐富部落格的多元性和趣味性

只是有時候圖檔會卡卡的,中途圖檔或播放lost圖檔,出現不完整,原因是限制或是不穩定

還在確認中,以下這個圖檔共傳了兩次,第一次傳似乎失敗,圖檔播出有失圖現象

第二次傳OK,現在預覽狀況圖像完整呈現,等等看看發表後的情形如何

 今日測試結果,正常播放,播放速度參數設定似乎有有回應,圖像沒有lose. OK

明日(25)再來上傳22日的雨量gif, (建議製作時先存成.xcf,在另存gif動畫,好處,事後要修改只能在.xcf做)

要等幾10幾秒才會出現圖檔,天兔由強颱轉為中度颱風,雖然沒有登路南臺灣,但卻帶來豐沛的與雨量

即使中央氣象局解除了陸上颱風警報,但颱風外圍氣流依舊夾帶水氣帶給台灣不小的雨量。

我將透過中央氣象局的分時(30分鐘)雨量累計圖的變化,製作成gif來呈現過程的變化
圖1:下載中請稍後

0923雨量動畫.gif  

 圖2:下載中請稍後....(後傳先出較圖1快幾秒5s)
25日test上傳修正後的雨量圖 start 1212PM,

雨量day22_R.gif  

 測試結果:OK 12:28PM 圖像正常沒有lose,

本次測試增加_修改圖層屬性_目的是<延緩顯示動作,在開頭即結尾時,讓主題能定格停住,感覺像在做幻燈片。
>(將預設質100ms,修改為1000ms~1500ms),
>點選作用圖層,如圖層1,按滑鼠右鍵,點選最上方的<修改塗層屬性>,在對話方塊中圖層1後面添加(1000ms)(combine),按卻確定,跳回原作用圖層就可以看到修改後的屬性在作用圖層中顯示

註:先存成.xcf(GIMP的預設檔名)以方便修改,預覽要在(濾鏡)選單中選(播放),完成後再另存新檔,動畫GIF檔。

使用GIMP 2.6 自由軟體

空大 小熊 發表在 痞客邦 留言(0) 人氣()