2. 程式人生 > >WMS GetFeatureInfo (Tile Layer)——WMS獲取要素信息（瓦片圖層）

WMS GetFeatureInfo (Tile Layer)——WMS獲取要素信息（瓦片圖層）

阿新 • • 發佈：2018-01-12
判斷 each event doctype sin cross comment css ram

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>WMS GetFeatureInfo (Tile Layer)</title>
  5. <link rel="stylesheet" href="https://openlayers.org/en/v4.2.0/css/ol.css" type="text/css">
  6. <!-- The line below is only needed for old environments like Internet Explorer and Android 4.x -->
  7. <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"></script>
  8. <script src="https://openlayers.org/en/v4.2.0/build/ol.js"></script>
  9. </head>
  10. <body>
  11. <div id="map" class="map"></div>
  12. <div id="info"> </div>
  13. <script>
  14. // WMS瓦片數據源
  15. var wmsSource = new ol.source.TileWMS({
  16. url: ‘https://ahocevar.com/geoserver/wms‘,
  17. params: {‘LAYERS‘: ‘ne:ne‘, ‘TILED‘: true},
  18. serverType: ‘geoserver‘,
  19. crossOrigin: ‘anonymous‘
  20. });
  22. // WMS瓦片圖層
  23. var wmsLayer = new ol.layer.Tile({
  24. source: wmsSource
  25. });
  27. var view = new ol.View({
  28. center: [0, 0],
  29. zoom: 1
  30. });
  32. var map = new ol.Map({
  33. layers: [wmsLayer],
  34. target: ‘map‘,
  35. view: view
  36. });
  38. // 在地圖上單擊的時候獲取要素信息
  39. map.on(‘singleclick‘, function(evt) {
  40. document.getElementById(‘info‘).innerHTML = ‘‘;
  41. var viewResolution = /** @type {number} */ (view.getResolution());
  42. var url = wmsSource.getGetFeatureInfoUrl(
  43. evt.coordinate, viewResolution, ‘EPSG:3857‘,
  44. {‘INFO_FORMAT‘: ‘text/html‘});
  45. if (url) {
  46. document.getElementById(‘info‘).innerHTML =
  47. ‘<iframe seamless src="‘ + url + ‘"></iframe>‘;
  48. }
  49. });
  51. // 根據map的forEachLayerAtPixel方法來判斷當前像素位置是否有要素，如果有則改變鼠標樣式
  52. map.on(‘pointermove‘, function(evt) {
  53. if (evt.dragging) {
  54. return;
  55. }
  56. var pixel = map.getEventPixel(evt.originalEvent);
  57. var hit = map.forEachLayerAtPixel(pixel, function() {
  58. return true;
  59. });
  60. map.getTargetElement().style.cursor = hit ? ‘pointer‘ : ‘‘;
  61. });
  62. </script>
  63. </body>
  64. </html>

WMS GetFeatureInfo (Tile Layer)——WMS獲取要素信息（瓦片圖層）

相關推薦

WMS GetFeatureInfo (Tile Layer)——WMS獲取要素信息（瓦片圖層）

判斷 each event doctype sin cross comment css ram <!DOCTYPE html> <html> <head> <title>WMS GetFeatureI

Python獲取系統信息（慢慢補充）

ces 慢慢 hat .get spl 主機名 start serve /etc/ 獲取OS信息： 1. os = " ".join(platform.linux_distribution()) 2. os = subprocess.call([‘cat‘, ‘/etc/r

linux腳本獲取系統信息（選自實驗樓實驗）

可用 led all .sh sys info 腳本 cpu process 執行getinfo.sh腳本後，不需要任何參數，輸出內容如下：$ bash getinfo.shcpu num: 2memory total: 2.8Gmemory free: 329Mdisk

考勤信息（員工打卡）

time blog 重新 att 一個 gif 加載 ++ binding 實現員工的添加，查詢和刪除，並用dgvList顯示出來 1.1///先聲明一個單列集合 public List<SE> list = new List<SE>();

Nginx輸出基本狀態信息（Ngx_http_stub_module模塊）

web；nginx；linux輸出Nginx基本狀態信息（Ngx_http_stub_status_module）官方文檔:http://nginx.org/en/docs/http/ngx_http_status_module.html官方定義:The ngx_http_stub_status_module

phpcms之帶圖片的登錄信息（帶cookie版）

index rpo pat spa ember end pos php member {php if(!HTTP_REFERER || strpos(HTTP_REFERER,‘&a=login‘)) @header("Location: ".$_GET[‘for

Lync 項目經驗-41-查詢-啟用-Lync-用戶-詳細信息（項目中）

服務器 Lync Get-CSADuser -ou "ou=雲計算(中國)有限公司,dc=i-x-Cloud,dc=com" -Filter {SipAddress -ne $null} | select SamAccountName,DisplayName,MobilePhone,Phone,Sip

SQL調優技巧：統計信息（文末福利）

SQL 統計信息 優化器 點擊上方“異步社區”，選擇“置頂公眾號”技術幹貨，第一時間送達統計信息類似於戰爭中的偵察兵，如果情報工作沒有做好，打仗就會輸掉戰爭。同樣的道理，如果沒有正確地收集表的統計信息，或者沒有及時地更新表的統計信息，SQL的執行計劃就會跑偏，SQL也就會出現性能問題。收集統計信息

Python封裝一個函數接受文件夾的名稱作為輸入參數,打印該文件夾中的的全部路程信息（遍歷路徑）

Python 遍歷文件夾Python時間簡單的遍歷文件夾路徑，代碼如下：import os def bianli(path):info = os.listdir(path)for v in info:p = os.path.join(path, v)print(p)if os.path.isdir(p):b

查看鎖信息（開啟InnoDB監控）

ring 共享 表名 統計信息 數據結構 status 輸出 rman this 當前mysql版本：5.6.21 一、背景 在mysql處理死鎖問題時，由於show engine innodb status輸出來的死鎖日誌無任務事務上下文，並不能很好地診斷相關事務

KEGG下載某物種最新的版本信息（斑馬魚為例）

ref nbsp wid 結構 egg 解析 image 版本 ima 步驟一：打開鏈接並選擇物種 http://www.genome.jp/kegg-bin/get_htext?hsa00001+3101 步驟二：對文件進行解析 步驟三：統計信息 一級結構（6大類）：

13. Java基礎之類型信息（RTTI和反射）

getmethod 類型 void import 得到 攜程 表達 返回 現在 一. 背景 並不是所有的Class都能在編譯時明確，因此在某些情況下需要在運行時再發現和確定類型信息（比如：基於構建編程，），這就是RTTI（Runtime Type Info

WMS GetFeatureInfo (Layers)——WMS獲取要素資訊（圖層）

Demonstrates the use of the layers option in the ol.format.WMSGetFeatureInfo format object, which allows features returned by a single WMS GetFeatureIn

openlayer WMS GetFeatureInfo（圖層）

WMS GetFeatureInfo（圖層） 所有功能： 6 酒店特色： 2 餐廳特色： 4 演示layers在ol/format/WMSGetFeatureInfoformat物件中使用該選項，該選項允許單個WMS GetFeatureInf

php定位並且獲取天氣信息

location php定位 city ext ons print map res func 1 header("Content-type: text/html; charset=utf-8"); 2 class getWeather{ 3 private

java解析xml文件練習——通過應用包名獲取應用圖標即其他信息（基於魅族應用商店）

fin vma tdm row con smartd enter music close 1、解析包名數據文件（txt文件），並生成包名數組： package jsouphtml; import java.io.BufferedReader; import j

android 獲取手機信息工具類

telephony == 系統 設備 android pack devices 信息 context package com.yqy.yqy_listviewheadview; import android.content.Context; import androi

獲取css信息

com 但是 tex col 不支持 style css 設置 ons 1 一般情況是用style直接獲取css信息但是style只能獲取到卸載行內的樣式外鏈的和嵌入的樣式會獲取不到 2 2.5　　　　　　　用下面方法獲取外鏈和嵌入的css樣式

Android之使用MediaMetadataRetriever類獲取媒體信息

ren sym wid cte pad () 許可 card med 一.昨天。介紹了使用MediaMetadataRetriever類來獲取視頻第一幀：http://blog.csdn.net/u012561176/article/details/47858099，今

常用Request對象獲取請求信息

-a 5.1 操作 ica 請求 put form mil 用戶訪問 Request.ServerVariables(“REMOTE_ADDR”) ‘獲取訪問IPRequest.ServerVariables(“LOCAL