iOS高德地圖WMS服務&Mapbox地圖WMS服務

来源:https://www.cnblogs.com/zongqingmeng/archive/2020/05/21/12931009.html
-Advertisement-
Play Games

網路地圖服務（WMS） 網路地圖服務（WMS）利用具有地理空間位置信息的數據製作地圖。其中將地圖定義為地理數據可視的表現。能夠根據用戶的請求返回相應的地圖（包括PNG，GIF，JPEG等柵格形式或者是SVG和WEB CGM等矢量形式）。WMS支持網路協議HTTP，所支持的操作是由URL定義的。 先來 ...


網路地圖服務（WMS）

     網路地圖服務（WMS）利用具有地理空間位置信息的數據製作地圖。其中將地圖定義為地理數據可視的表現。能夠根據用戶的請求返回相應的地圖（包括PNG，GIF，JPEG等柵格形式或者是SVG和WEB CGM等矢量形式）。WMS支持網路協議HTTP，所支持的操作是由URL定義的。

     先來分析一波服務鏈接：
     一般情況給我們的是這樣的：http://... .../geoserver/xf/wms?service=WMS&version=1.1.0&request=GetMap&layers=zgwz_lzyz_f08&styles=&bbox=-1844.9489742784644,0.0,35699.99999999942,34437.74999999997&width=768&height=704&srs=EPSG:3857&format=application/openlayers

     參數：

  • service=WMS
  • version=1.1.0 ： 版本（1.1...和1.3...在計算上有區別）
  • request=GetMap
  • layers=zgwz_lzyz_f08 ：圖層數組（這個參數如果錯誤則不顯示）
  • styles=
  • bbox=-1844.9489742784644,0.0,35699.99999999942,34437.74999999997 : 盒子（顯示區域）一般是需要計算
  • width=768
  • height=704
  • srs=EPSG:3857 ：坐標類型 ：3857同900913為偽墨卡托投影，也被稱為球體墨卡托坐標；4326為WGS84經緯度坐標
  • format=application/openlayers ：格式，iOS用這個format=image/png
  • TRANSPARENT=TRUE ：透明 true：可以看到高德底圖，false看不到高德底圖
  •  ==>**http://... .../geoserver/xf/wms?SERVICE=WMS&VERSION=1.1.0&REQUEST=GetMap&LAYERS=zgwz_lzyz_f08_gd&TRANSPARENT=TRUE&STYLES=&WIDTH=762&HEIGHT=768&srs=EPSG:3857&FORMAT=image/png&BBOX=

 

 一、高德地圖:

     通過高德地圖 MATileOverlay 介面，添加 WMS 服務到地圖上

    1.自定義類WMSTileOverlay繼承自MATileOverlay

import UIKit

class WMSTileOverlay: MATileOverlay {
    var rootURL = ""
    var titleSize = 0
    var initialResolution = 0.0
    var originShift = 0.0
    var HALF_PI = 0.0
    var RAD_PER_DEGREE = 0.0
    var HALF_RAD_PER_DEGREE = 0.0
    var METER_PER_DEGREE = 0.0
    var DEGREE_PER_METER = 0.0
    
    /// 初始化
    /// - Parameter initRootURL: 線上地圖路徑&TRANSPARENT=TRUE&FORMAT=image/png&BBOX=
    init?(rootURL initRootURL: String?) {
        super.init()
        rootURL = initRootURL ?? ""
        titleSize = 256
        initialResolution = 156543.03392804062////2*Math.PI*6378137/titleSize
        originShift = 20037508.342789244//周長的一半 2*Math.PI*6378137/2.0
        HALF_PI = .pi / 2.0
        RAD_PER_DEGREE = .pi/180.0
        HALF_RAD_PER_DEGREE = .pi/360.0
        METER_PER_DEGREE = originShift/180.0//一度多少米
        DEGREE_PER_METER = 180.0/originShift//一米多少度
    }
    
    /**
     * @brief 以tile path生成URL。用於載入tile,此方法預設填充URLTemplate
     * @param path tile path
     * @return 以tile path生成tileOverlay
     */
    override func url(forTilePath path: MATileOverlayPath) -> URL {
        
        let strURL = "\(rootURL)\(titleBoundsBy(x: path.x, y: path.y, zoom: path.z) ?? "")"
        let url = URL(string: strURL)
        return url!
    }
    
    /**
     * @brief 載入被請求的tile,並以tile數據或載入tile失敗error訪問回調block;預設實現為首先用URLForTilePath去獲取URL,然後用非同步NSURLConnection載入tile
     * @param path tile path
     * @param result 用來傳入tile數據或載入tile失敗的error訪問的回調block
     */
    override func loadTile(at path: MATileOverlayPath, result: @escaping(Data?, Error?) -> Void) {
        let url = self.url(forTilePath: path)
        let request = NSMutableURLRequest(url: url)
        request.httpMethod = "GET"
        let session = URLSession.shared
        session.dataTask(with: request as URLRequest, completionHandler: {(data, response, error) in
            if error != nil {
                #if DEBUG
                print("Error downloading tile")
                #endif
                result(nil, error)
            }
            else {
                result(data, nil)
            }
        }).resume()
    }
    
    /// 取消請求瓦片，當地圖顯示區域發生變化時，會取消顯示區域外的瓦片的下載, 當disableOffScreenTileLoading=YES時會被調用。since 5.3.0
    /// - Parameter path: path
    override func cancelLoadOfTile(at path: MATileOverlayPath) {
        super.cancelLoadOfTile(at: path)
    }
    
    /**
     * 根據瓦片的x/y等級返回瓦片範圍
     *
     * @param tx
     * @param ty
     * @param zoom
     * @return url
     */
    func titleBoundsBy(x: Int, y: Int, zoom: Int) -> String? {
        let minX = pixels2Meters(x * titleSize, zoom: zoom)
        let maxY = -pixels2Meters(y * titleSize, zoom: zoom)
        let maxX = pixels2Meters(((x + 1) * titleSize), zoom: zoom)
        let minY = -pixels2Meters(((y + 1) * titleSize), zoom: zoom)
        
        return "\(minX),\(minY),\(maxX),\(maxY)"
    }
    
    /**
     * 根據像素、等級算出坐標
     *
     * @param p p
     * @param zoom z
     * @return double
     */
    func pixels2Meters(_ p: Int, zoom: Int) -> Double {
        return Double(p) * resolution(zoom) - originShift
    }
    
    /**
     * 計算解析度
     *
     * @param zoom z
     * @return double
     */
    func resolution(_ zoom: Int) -> Double {
        return initialResolution / (pow(2.0, Double(zoom)))
    }
}

    2.在地圖控制器MapController調用

import UIKit
class MapController: UIViewController {
    let tileOverlay = WMSTileOverlay.init(rootURL: "http://... .../geoserver/haitu/wms?SERVICE=WMS&VERSION=1.1.0&REQUEST=GetMap&LAYERS=haitu:gis_t_landuse_a&TRANSPARENT=TRUE&STYLES=&srs=EPSG:3857&FORMAT=image/png&BBOX=")
    
    override func viewDidLoad() {
        super.viewDidLoad()
        let map = MAMapView(frame: frame: view.bounds)
        mapView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
        mapView.setCenter(CLLocationCoordinate2D(latitude: 39.97000000, longitude: 116.3300000), zoomLevel: 20, animated: false)
        tileOverlay?.disableOffScreenTileLoading = true//停止不在顯示區域的瓦片下載
        mapView.add(tileOverlay)
        view.addSubview(mapView)
    }
}

 

     3.異常處理

   （1）WMS服務地圖沒有坐標：會導致圖層不能顯示在正確的位置，這時候圖層會顯示在地圖的（0，0）坐標位置（非洲），排查的方法就是將地圖中心設置在（0，0）坐標，然後放大。解決辦法就是製圖工程師給你個帶坐標的圖。

   （2）圖層疊加了很多次：第一齣現這種情況有可能是我們自己對圖層做的緩存引起的。可以刪除緩存試試。

   （3）出現柵格：這種情況有可能發佈的圖有問題，或者bbox參數計算出現了問題。出現這種情況的原因很多，歡迎補充。

   （4）坐標系不同、WMS版本1.1和1.3：如果WMS服務給的是84坐標系，疊加到高德上會出現偏移，可以讓製圖工程師出一個高德坐標系的圖，也可以我們自己在代碼里做，會有一點計算量，代碼如下：

     在第1步自定義類WMSTileOverlay中的方法func titleBoundsBy(x: Int, y: Int, zoom: Int) -> String?更改

/**
 * 根據瓦片的x/y等級返回瓦片範圍
 *
 * @param tx
 * @param ty
 * @param zoom
 * @return url
 */
func titleBoundsBy(x: Int, y: Int, zoom: Int) -> String? {
    let minX = pixels2Meters(x * titleSize, zoom: zoom)
    let maxY = -pixels2Meters(y * titleSize, zoom: zoom)
    let maxX = pixels2Meters(((x + 1) * titleSize), zoom: zoom)
    let minY = -pixels2Meters(((y + 1) * titleSize), zoom: zoom)
    
    return "\(minX),\(minY),\(maxX),\(maxY)"
}

 

     改為

/**
 * 根據瓦片的x/y等級返回瓦片範圍
 *
 * @param tx
 * @param ty
 * @param zoom
 * @return url
 */
func titleBoundsBy(x: Int, y: Int, zoom: Int) -> String? {
    var minX = pixels2Meters(x * titleSize, zoom: zoom)
    var maxY = -pixels2Meters(y * titleSize, zoom: zoom)
    var maxX = pixels2Meters(((x + 1) * titleSize), zoom: zoom)
    var minY = -pixels2Meters(((y + 1) * titleSize), zoom: zoom)
    
    //轉換成經緯度
    minX = meters2Lon(minX)
    minY = meters2Lat(minY)
    maxX = meters2Lon(maxX)
    maxY = meters2Lat(maxY)
    
    //轉換目標經緯度為高德坐標系。
    let amapcoord = AMapCoordinateConvert(CLLocationCoordinate2DMake(CLLocationDegrees(minY), CLLocationDegrees(minX)), type)
    minY = amapcoord.latitude
    minX = amapcoord.longitude
    let maxAmapcoord = AMapCoordinateConvert(CLLocationCoordinate2DMake(CLLocationDegrees(maxY), CLLocationDegrees(maxX)), type)
    maxY = maxAmapcoord.latitude
    maxX = maxAmapcoord.longitude
    
    //轉換成墨卡托
    minX = lon2Meters(minX)
    minY = lat2Meters(minY)
    maxX = lon2Meters(maxX)
    maxY = lat2Meters(maxY)
    
    //有博客提到1.1版本和1.3版本有區別，沒有嘗試過，如果你遇到了歡迎補充
    result = "\(minX),\(minY),\(maxX),\(maxY)" //1.1
    //result = "\(minX),\(minY),\(maxX),\(maxY)"//1.3
    
    return result
}

//////添加坐標轉換相應的方法
/**
 * X米轉經緯度
 */
func meters2Lon(_ mx: Double) -> Double {
    let lon = mx * DEGREE_PER_METER
    return lon
}

/**
 * Y米轉經緯度
 */
func meters2Lat(_ my: Double) -> Double {
    var lat = my * DEGREE_PER_METER
    lat = 180.0 / .pi * (2 * atan(exp(lat * RAD_PER_DEGREE)) - HALF_PI)
    return lat
}

/**
 * X經緯度轉米
 */
func lon2Meters(_ lon: Double) -> Double {
    let mx = lon * METER_PER_DEGREE
    return mx
}

/**
 * Y經緯度轉米
 */
func lat2Meters(_ lat: Double) -> Double {
    var my = log(tan((90 + lat) * HALF_RAD_PER_DEGREE))/(RAD_PER_DEGREE)
    my = my * METER_PER_DEGREE
    return my
}

 

二、Mapbox地圖:

      建議：做室內地圖的用Mapbox，因為Mapbox縮放級別可以達到1米的效果。

 1.Mapbox的WMS服務和添加柵格圖像是一樣的，甚至不需要我們做修改,唯一需要註意的是參數：bbox={bbox-epsg-3857}

import UIKit
import Mapbox

class ViewController: UIViewController, MGLMapViewDelegate {
    var mapView: MGLMapView!
    var rasterLayer: MGLRasterStyleLayer?
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        mapView = MGLMapView(frame: view.bounds)
        mapView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
        
        mapView.setCenter(CLLocationCoordinate2D(latitude: 39.97000000, longitude: 116.3300000), zoomLevel: 20, animated: false)
        
        mapView.delegate = self
        
        view.addSubview(mapView)
        
        // Add a UISlider that will control the raster layer’s opacity.
        addSlider()
    }
    
    func mapView(_ mapView: MGLMapView, didFinishLoading style: MGLStyle) {
        // Add a new raster source and layer.
        let source = MGLRasterTileSource(identifier: "stamen-watercolor", tileURLTemplates: ["http://.../geoserver/xf/wms?service=WMS&version=1.1.0&request=GetMap&layers=zgwz_lzyz_f08_3857&styles=&bbox={bbox-epsg-3857}&width=768&height=704&srs=EPSG:3857&format=image/png"], options: [ .tileSize: 256 ])
        let rasterLayer = MGLRasterStyleLayer(identifier: "stamen-watercolor", source: source)
        
        style.addSource(source)
        style.addLayer(rasterLayer)
        
        self.rasterLayer = rasterLayer
    }
    
    @objc func updateLayerOpacity(_ sender: UISlider) {
        rasterLayer?.rasterOpacity = NSExpression(forConstantValue: sender.value as NSNumber)
    }
    
    func addSlider() {
        let padding: CGFloat = 10
        let slider = UISlider(frame: CGRect(x: padding, y: self.view.frame.size.height - 44 - 30, width: self.view.frame.size.width - padding * 2, height: 44))
        slider.minimumValue = 0
        slider.maximumValue = 1
        slider.value = 1
        slider.isContinuous = false
        slider.addTarget(self, action: #selector(updateLayerOpacity), for: .valueChanged)
        view.insertSubview(slider, aboveSubview: mapView)
        if #available(iOS 11.0, *) {
            let safeArea = view.safeAreaLayoutGuide
            slider.translatesAutoresizingMaskIntoConstraints = false
            let constraints = [
                slider.bottomAnchor.constraint(equalTo: safeArea.bottomAnchor, constant: -mapView.logoView.bounds.height - 10),
                slider.widthAnchor.constraint(equalToConstant: self.view.frame.size.width - padding * 2),
                slider.centerXAnchor.constraint(equalTo: safeArea.centerXAnchor)
            ]
            
            NSLayoutConstraint.activate(constraints)
        } else {
            slider.autoresizingMask = [.flexibleTopMargin, .flexibleLeftMargin, .flexibleRightMargin]
        }
    }
}

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • sql server如何通過pivot對數據進行行列轉換
    腳本： /* 說明：sql server如何通過pivot對數據進行行列轉換 腳本來源：https://www.cnblogs.com/zhang502219048/p/12933347.html */ create table #t ( [員工工號] nvarchar(50), [員工姓名] nv ...
  • Redis 哨兵機制
    雖然現在使用哨兵+主從的方式比較少了，但通過理解 Redis 哨兵，我們能獲得更深入的分散式的知識。 https://redis.io/topics/sentinel sentinel基本配置 sentinel的作用： 1、監控 2、通知 3、自動故障轉移 （1.投票決策master是否掛了，如果投 ...
  • kudu安裝與運行
    首先我的伺服器是Centos7.6。低於7版本的小伙伴不可照搬。 我選擇的是使用rpm的方式進行安裝，比較方便。 "kudu安裝包下載地址" ctrl+f 查找kudu，這6個rpm包都要下載下來，推薦使用迅雷下載 在下載的時候我們還需要做一些準備工作。執行以下命令，安裝必備的包。 沒有安裝ntp的 ...
  • Redis 主從複製全剖析
    Redis的主從複製是如何工作的？如何在同步數據的同時，還保持著高性能，你瞭解嗎？ https://redis.io/topics/replication 註意以下基於 redis 5 最新版本， 名詞和配置項已經被官方改為 ，其實是一個東西，都指從節點。 主從複製的基本流程 主 與 從 複製的基本 ...
  • NTP時鐘伺服器(NTP校時伺服器)日常維護與實施
    NTP時鐘伺服器(NTP校時伺服器)日常維護與實施 NTP時鐘伺服器(NTP校時伺服器)日常維護與實施 京準電子科技VX——ahjzsz 京準電子科技有限公司主營ntp網路時鐘伺服器，時鐘同步產品， 產品正在國內外各行業近萬個現場穩定運行，現就設備安裝、日常維護及解決方案做下總結。 一、NTP網路時 ...
  • Oracle異常處理—ORA-12514:監聽程式當前無法識別連接描述符中請求的服務
    oracle11g，安裝完成之後直接使用，今天用PLSQL鏈接突然報錯，報錯代碼為：ORA-12514:監聽程式當前無法識別連接描述符中請求的服務。網上查了這種異常的解決辦法，特在此記錄。 出現該問題一般有兩種情況。 第一種是在你安裝完之後未配置監聽（在此我暫時忘記安裝完之後有沒有配置監聽）； 第二 ...
  • 用了這麼多年MySql，這些好習慣你用過哪些
    一：新建表和欄位建議： 1.所有數據表和欄位要有清晰的註釋，欄位說明 說明：不管是創建者還是其他開發或者後續維護者都能清楚知道數據表和欄位定義的含義 2.表名、欄位名使用小寫字母或數字，禁止出現數字開頭 說明：MySQL在Windows下不區分大小寫，但在Linux下預設是區分大小寫，為了避免出現不 ...
  • 什麼是用戶畫像——從零開始搭建實時用戶畫像(一)
    用戶畫像 簡介 ​ 用戶畫像，作為一種勾畫目標用戶、聯繫用戶訴求與設計方向的有效工具，用戶畫像在各領域得到了廣泛的應用。 用戶畫像最初是在電商領域得到應用的，在大數據時代背景下，用戶信息充斥在網路中，將用戶的每個具體信息抽象成標簽，利用這些標簽將用戶形象具體化，從而為用戶提供有針對性的服務。 ​ 還 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發（一）：使用.NET MAUI開發第一個安卓APP
    移動開發（一）：使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說，近來想嘗試開發一款安卓APP，考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP，畢竟是使用Visual Studio開發工具，使用起來也比較的順手，結合微軟官方的教程進行了安卓 ...
  • wpf ToggleButton選中效果和一個登錄界面
    前言 QuestPDF 是一個開源 .NET 庫，用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫，它徹底改變了我們生成 PDF 文檔的方 ...
  • 彈幕樹洞項目功能新增篇
    項目地址 項目後端地址： https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址： ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址： http://tree ...
  • 第27篇 sqlserver2022詳細安裝步驟
    話不多說，直接開乾 一.下載 1.官方鏈接下載： https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe，運行開始下載SQL server； 二. ...
  • .NET 開源高性能 MQTT 類庫
    前言 隨著物聯網（IoT）技術的迅猛發展，MQTT（消息隊列遙測傳輸）協議憑藉其輕量級和高效性，已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫，為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog文檔翻譯系列（六） - 可用的接收器、增強器、格式化輸出
    Serilog支持多種接收器用於日誌存儲，增強器用於添加屬性，LogContext管理動態屬性，支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項，適用於不同需求。 ...
  • 警惕 Visual Studio 屬性求值副作用導致邏輯不符合預期
    目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據，爬取信息時需要模擬瀏覽器行為，否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下： 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • [使用目前最新版]HybridCLR6.9.0+YooAsset2.2.4實現純C# Unity熱更新方案 (一)
    1.前言 什麼是熱更新 游戲或者軟體更新時，無需重新下載客戶端進行安裝，而是在應用程式啟動的情況下，在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR，Xlua，ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles，Addressable， ...
  • 在 ASP.NET Core Web API 中使用操作篩選器統一處理通用操作
    本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺，其實像阿裡雲，騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後，它會送 ...
  • 第28篇 如何.net中實現高效可靠數據同步api
    通過以下方式可以高效，並保證數據同步的可靠性 1.API設計 使用RESTful設計，確保API端點明確，並使用適當的HTTP方法（如POST用於創建，PUT用於更新）。 設計清晰的請求和響應模型，以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證，確保接收到的數據符合預期格 ...
所有分類