w9

第八堂

課程內容

  • google map API→從老師部落格先叫出地圖連結網址→q=經緯度，z=map上地圖涵蓋範圍
  • <iframe>→在網頁內挖洞，在洞內塞其他網頁，EX:把map丟進去(地圖網址後記得加上&output=embed)
  • 利用按鈕把洞內容換掉
    1. setAttribute("A","B")→將A標籤內屬性換成B
    2. 新增一按鈕→在iframe內id→增一function(when按鈕，換地圖)→setAttribute("src","網址")→以變數loc讓洞內容可以換很多個→f(loc) / 網址"http......q=" + loc+ "&z=......embed" / <a href="javascript:f('座標位置');">按鈕名稱</a>

  • 將地圖作為一元素，開一新網頁
    1. 使用URL
    2. 在網頁一改網址可開新location→?loc=座標
    3. 應用：test1(含list)，test2(似card連結到商品頁)→if要多加元素就多幾個var就好

  • 導航：<a target="_blank" href="http......saddr=起點座標&daddr=終點座標">按鈕名稱</a>→開新視窗；if無sadder，即從所在位置出發

課堂心得

        今天主要是學google map相關應用，第一種方式是在網頁內挖洞，再塞進map，同時試著用不同按鈕叫出不同地圖；第二種方式則是將地圖當成一種元素，組合到另一新視窗，這就要應用到以前學過的href，最後我們還學了如何用google導航找出路線。

        今天學的內容可能可以在一網頁中建立一個list，再直接連結到各自地圖位置。之後的課老師說會留時間讓我們做期末網頁，在下次上課之前要先大致構想好，下節課我要記得帶自己電腦！

<!DOCTYPE html>

<html>

<head>

<script>

function f(loc) {

document.getElementById("demo").setAttribute("src", "http://maps.google.com.tw/maps?f=q&hl=zh-TW&q=" + loc+ "&z=16&t=q&output=embed");

}


// 取得網址裡的參數 

function GetUrlVar(VarName) 

{

//alert(VarName);

  name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");

  var regexS = "[\\?&]" + VarName + "=([^&#]*)";

  var regex = new RegExp(regexS);

  var results = regex.exec(window.location.href);

  if (results == null)

    return "";

  else

return results[1];

}


  

 



</script>

</head>



<body>


<a href="javascript:f('24.120858, 120.673152');">地點1</a>

<a href="javascript:f('24.123549, 120.680722');">地點2</a>

<a href="javascript:f('24.120856, 120.674295');">地點3</a>


<iframe id="demo" src="http://maps.google.com.tw/maps?f=q&hl=zh-TW&q=24.121308,120.677175&z=16&t=q&output=embed" width="100%" height="400">

</iframe>


<script>


 // 要先取得網址裡的路徑起點終點經緯度參數 

  var X = decodeURIComponent(GetUrlVar('loc'));

  f(X);


</script>



</body>

</html>

留言

張貼留言

這個網誌中的熱門文章

 穿戴式監控裝置利弊 "No one shall be subjected to arbitrary interference with his privacy, family, home or correspondence, nor to attacks upon his honour and reputation Everyone has the right to the protection of the law against such interference or attacks." --Universal Declaration of Human Rights , Article 12. 前言 　　根據聯合國所頒布的 《世界人權宣言》中第十二條 明確指出，任何人皆有權享有私生活、家庭、住宅和通信等隱私保護，然今科技日新月異，在許多方面，科技往往走在法律之前，並逐漸威脅到人們的隱私甚至人身安全，其中隱含著高度風險的領域即為醫療與個人健康資訊，而其監控核心便是穿戴式裝置，我們又如何能斷定在成功獲取我們的心律、腦波後，未來不會藉此進一步分析我們的所思所想？本文我們將針對穿戴式裝置進行科技與隱私的深入探討與分析。 何謂 穿戴式裝置         在醫療保健領域中，穿戴式裝置意即消費者可以配戴的電子設備，目的是收集用戶的個人健康數據並即時傳送給醫療專業人士，最原始的穿戴技術用於健身方面，是配備了感測器的腕帶，能追蹤用戶的身體活動和心律，並與智慧型手機同步，提供用戶健康健身方面建議，此後隨者市場對於穿戴式監控裝置需求的日益增長，發展出了各式監控血壓、呼吸律抑或溫度的相關裝置，知名企業有如 Proteus 、 Neurotech 、 Augmedix 等( 2022 Top10穿戴式醫療裝置開發公司 )。 優點         在過去5年中，穿戴式健康監控裝置的使用率增加了兩倍之多，其於市場中的高接受度絕非毫無來由，對醫生來說，他的最大優勢為便利性，他提供了一個能自動紀錄並追蹤病人即時狀況的機會，這也使我們不難理解為何他能在近年的開發市場中有著爆炸性的成長，以下我們將探討穿戴式裝置在醫學領域帶來的助益： 1.  方便－ 穿戴式裝置通常穿戴簡便，能夠即時追蹤病人狀況，並回傳給醫療機構，對醫院來說減少了時間與成本，對病人來說也省下掛號及復診的時間、
閱讀完整內容

W2

 第二堂 課程內容 把上禮拜body上的字串換成照片呈現 注意""&''要成對出現 <img src=" 照片網址 " alt="Trulli" width="500" height="333">→ 絕對位置 用myFunction1.第一張、 myFunction2.第二張，對照各自照片網址→ not good 一按鈕對依照片效率差 字串常數變數 將照片網址用函數X替換對照                               <button onclick="myFunction1( ' 網址 ' )">上一張</button>                               myFunction1(x)                          '<img src="' + x + '" alt="Trulli" width="500" height="333">'→ +表連接                       💣字串常數必用一引號→變成 一字元                             變數 不可用引號 陣列(Javascript Array) 將var cars內各個網址對應到myFunction1的0、1                               <button onclick="myFunction1( '0' )">上一張</button>                               <button onclick="myFunction1( '1' )">下一張</button>                                myFunction1(x)                               
閱讀完整內容