Y星人の工作語錄

別理我, 我只是一個愛發勞騷的Y星人

10月
01

Walkin’s Scooter 會在 nuvi255 像綠巨人般的在地圖上行走 :)

Posted by YuanYuan under nuvi255W

Garmin Nuvi 系列的機器有個好玩的功能, 就是可以下載不同的導航圖示.

當成行車的指示的圖示. 之前玩過 Nuvi200/760, 導航圖示是不動的, 我就在想, 這些圖示如果能稍微有動感些, 會更棒. 既然各家的導路指引圖示都大同小異, 那 nuvi 這個自訂導航圖示功能, 就多了一些趣味在.

今天剛好看到Garmin 的 Walkin’s Scooter , 看它在網頁上在走路的樣子, 我就想, 難道, 會在地圖上走路? 以前, 我在做地圖應用時, 就想做一個人可以在地圖上走路, 如果再藉著 GPS 的功能, 結合 googleMap 的 3D street view, 就會變成很立體即時的資訊.

於是給它下載放到 nuvi255W 裡看看, 咦, 真沒想到, 我看到 Scooter 竟然在Nuvi255W 的地圖上, 像一個綠巨人般的行走著, 哈, 這是一大進步, 在導航過程中, 增加一點趣味.

你可以猜猜, Scooter 在高速公路上一步的距離是多少? 答案是: 50公尺. 哈哈, 原則上, 他還是會隨著畫面的放大縮小, 而有所改變的.

然後又試了 Nuvi 760 和 Nuvi200, 咦, 不能像 255W 那樣, 播放 Scooter 走路的雄姿, 只能看到一個靜態的圖片. 有點可惜啊. 也許, 機器硬體備配的關係, 播放動態圖片, 可能會影響到 GPS 的運算功能, 有機會拿到路上實測一下看看. (道路導航模擬模式的走路影片, 稍候上傳)

9月
26

jsmap - Taiwan

Posted by YuanYuan under Map, javascript

jsmap is easy and simple javascript map.

I made Taiwan Map form richyli.

 looks great. asap, I’ll upload the final Version.

     

now, let’s see the example.

9月
23

Dynamic Alexa Charts

Posted by YuanYuan under javascript

有人想知道公司在 Alexa 的排名狀況, 用了 Alexa 提供的 script 卻無法在 localhost 或是沒有 domain 上顯示(ex: cubila, xxxxx:80,…..), 而且功能也陽春. 於是找到了 Dynamic Alexa Charts, 嗯, 還不錯, 但我修改了一下, 讓它更簡單一些. 原則上, 它是顯示圖而已, 而不是像 Alexa 上提供的 Site Widgets 是顯示 Flash.

  1. <!-- Here's the stuff you want to copy -->
  2. <label for="rdoType0"><input type="radio" id="rdoType0" name="rdoType" value="0" checked onclick="doAlexa()">Reach</label>
  3. <label for="rdoType1"><input type="radio" id="rdoType1" name="rdoType" value="1" onclick="doAlexa()">Page Views</label>
  4. <label for="rdoType2"><input type="radio" id="rdoType2" name="rdoType" value="2" onclick="doAlexa()">Traffic Rank</label>
  5. <br>
  6. URL 1: <input type="text" id="txtURL1" name="txtURL1" style="WIDTH:300px" value="http://www.google.com"
  7. onchange="doAlexa()" onkeyup="doAlexa()">
  8. Chart Scale:
  9. <!-- // "7d", "1m", "3m", "6m", "1y", "3y", "5y", "max" -->
  10. <select id="scale" onChange="doAlexa()">
  11. <option value="7d">7d</option>
  12. <option value="1m">1m</option>
  13. <option value="3m" selected="selected">3m</option>
  14. <option value="6m">6m</option>
  15. <option value="1y">1y</option>
  16. <option value="3y">3y</option>
  17. <option value="5y">5y</option>
  18. <option value="max">max</option>
  19. </select>
  20. <br>
  21. <img id="imgAlexa">
  22.  
  23. <script language="javascript">
  24. function doAlexa() {
  25. var txtWidth = "450";
  26. var txtHeight = "350";
  27. var ss_ = document.getElementById('scale').selectedIndex;
  28.  
  29. var s_ = document.getElementById('scale').options[document.getElementById('scale').selectedIndex].value;
  30.  
  31.     var str = 'http://traffic.alexa.com/graph?';
  32.  
  33.     str += 'w=' + txtWidth;
  34.     str += '&h=' + txtHeight;
  35.     str += '&r=' + s_;
  36.  
  37.     if (document.getElementById('rdoType0').checked) {
  38.         str += '&y=r';
  39.     } else {
  40.         if (document.getElementById('rdoType1').checked) {
  41.             str += '&y=p';
  42.         } else {
  43.             str += '&y=t';
  44.         }
  45.     }
  46.    
  47.     str += '&u=' + document.getElementById('txtURL1').value;
  48.  
  49.     var objImg = document.getElementById('imgAlexa');
  50.     objImg.src = str;
  51.  
  52.     objImg.width = txtWidth;
  53.     objImg.height = txtHeight;
  54. }
  55. doAlexa();
  56. </script>
  57. </div>
  58. </div>
  59. <!-- /Here's the stuff you want to copy -->

我修改了原來要輸入及選擇的部份, 讓選擇的日期區間做一個統一. 可以把上面的原始碼, 複製到你的 html 裡, 然後用瀏覽器看一下, 就知道 alexa 的相關資訊了. 有需要的人,把它放到你的 blog 或是網站也可以, 相當方便.

Alexa 是透過用戶安裝 Alexa Toolbar 來收集用戶的網站瀏覽資訊,做為各個網站的流量、到訪率以及排名。所以, 是統計有裝 Alexa toolbar 的用戶才有用, 資訊也只能當作參考, 因為, 到底有多少人裝了 alexa toolbar ?