前言 昨天我們已經建立完地圖了，今天要來加一些每個WebGIS都會有的基本小功能，像是：底圖切換、導航工具、滑鼠坐標、比例尺、鷹眼圖，還有一些比較不常用但也可以...
前言 前幾天先把資料庫、地圖服務都搞定了，現在就要來開始寫圖台了加緊腳步，今天就可以有一個像樣的畫面了！ 今天的主要大綱： 先介紹一下預計的網頁架構 建立AS...
前言 今天回歸寫程式，發現寫文章的速度趕不上發文的速度，但我還是會努力把文章生出來的！平常太少寫文章了，文筆不是很好請見諒。 若有用過GIS相關系統的人應該都知...
前言 今天來進行河川水位站的介接，回歸寫程式囉~ 水位站資料API介接 水位站資料： 民生公共物聯網：水利署河川水位站API 水利署：WRA API 水...
前言 昨天我們學會了坐標系統的相關知識，並利用proj4進行坐標轉換，而今天我們就要把坐標轉換這個用於定位功能開發上。 我們的圖台底圖是介接OpenStreet...
前言 WebGIS基本功能系列來到第三天了，今天沒有什麼遠大的目標，就是把圖面量測小工具搞定而已！ 圖面量測小工具 Openlayers的圖面量測官網範例基本上...
銜接昨天的圖層清單功能，今天略過前言，直接進入主題 今天的大綱 圖層資料庫建立 (Day 11) 1-1. 建立Database Schema (Day 1...
為什麼要寫這個題目 參加30天鐵人是為了要讓自己有壓力撰寫和系統性地統整技術文章，並加強自己的撰寫敘述技巧思考了很久要寫什麼題目，想來想去還是先從自己較為熟悉的...
前言 昨天已經寫完了地圖小工具的所有功能function，今天就要要把這些funtion塞到介面上給使用者自由操作自由開關。另外再開發一個小功能，可以有一個框框...
前言 最後一天的系統開發學習我們來說明如何輸出地圖資料，可以輸出為PNG、JPEG與PDF的格式。 地圖列印功能建置 新增 AdvanceTool/Export...
使用的版本為 openlayers-v4.5.0 參考https://openlayers.org/en/v4.6.5/apidoc/ol.Sphere.htm...
前言 今天我們要學習如何 展示全台GPS三維形變的時序性資料 ，這個功能是把這28天以前學到的東西做一個統整，把整個流程串起來，跟以往比較不一樣的是這次的資料來...
前言 終於到了最後一篇，話不多說，今天主要有3大主題： 首先先來回顧30天的文章內容 再來分享一些我原本想加進文章但沒時間加進去的內容 最後就是完賽心得拉！...
前言 昨天我們完成了全台即時水位與水位站基本資料介接的功能，從圖面上可以一目了然看出哪些地方的水位站有超過警戒值、哪些沒有，但由於圖面上沒有顯示測站的名稱 (若...
前言 結束了API和權限的部分，今天要回歸WebGIS繪圖功能的部分，讓大家都可以在地圖上畫一隻或更多隻的Pokemon。 還記得以前有大學生研究生來參訪，...
昨天完成了儲存繪圖圖形，今天就是要將那些儲存的圖形列表撈出來，並讓使用者套疊和管理。 今天的大綱 撈出儲存列表之API建立 還原使用者儲存之繪圖小工具 前端建...
接續昨天的繪圖，今天要將繪製的圖形存到使用者的個人繪圖當中。 今日的大綱 儲存頁面建立 資料庫建立 儲存繪圖API建立 前端圖形feature拆解 前端介接儲...
在openlayers中我們可以使用API提供的OSM，也可以額外依照需求設定自己的圖磚路徑 下面是內政部國土測繪中心提供的wmts圖磚連結，我們可以更換sou...
在學習openlayers時首先要理解openlayers中的結構，想當初我自己也是模模糊糊地就撞了進去，搞了老半天也看不懂到底在幹嘛，最後才發現原來open...
咱們是使用Geolocaion API，可以依照範例程式碼1-5來設定，要注意的是放到正式機的時候chrome限制要用https加密過後的才會正常運行，這個在l...
Openlayers中有許多元件，這次來玩看看View元件，透過控制View的中心點位置來讓使用者移動到想要的位置 有幾種不同的做法如下 方法一： https:...
Cluster稍微複雜一點，但是依照1-4步驟應該可以順利的完成並顯示Cluster在地圖上面。要注意的是層級結構，也就是誰包含誰，我記得我一開始學習的時候都搞...
基本上熱區圖是換到對應的API即可使用ol.layer.Heatmap以下是官網的範例，我只是抽出來我認為重要的部分，其他參數的調整或設定就依照專案需求調整控制...
如果你還沒有完成Day01的內容，請先去了解喔!! 階層 在我們新增座標點在地圖上之前，我們需要了解到openlayers中的階層問題如下 map vect...
https://openlayers.org/en/latest/examples/measure-style.html 控制測量工具Day08是透過overl...
Control openlayers中control是用來控制地圖的元件https://openlayers.org/en/latest/apidoc/modu...
本來想加入Openlayers( https://openlayers.org/ ) (version 7.4.0 )已全面改用JavaScript ES6，還...
大家好，恭喜你來到了Day04，今天要來了解如果我們有一個KML或GPX軌跡我們該如何放到地圖上呢? 首先，我們先要去取得我們的資料，這邊使用的範例是水利地理資...
記得先去嘗試Day11，先把咖啡廳的位置顯示在地圖上面 今天要是昨天的延伸，要來顯示feature中的資訊 注意，顯示資料前需要確保feature內是有資料的，...
參考文章https://openlayers.org/en/latest/examples/measure.html 跟官網的範例比較，我有把一些我認為比較會會...
JYHsu
iThome鐵人賽
看影片追技術