OpenLayer4.6.5繪製和編輯要素及獲取定位點

阿新 • • 發佈：2018-11-09

OpenLayer4.6.5繪製和編輯要素及獲取定位點

使用OpenLayer4.6.5API
參考資料
openlayers 顯示點選位置的經緯度
程式碼如下所示

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>繪製修改要素</title>
        <script src="../jslib/jquery-1.7.2.min.js"></script 
>
        <link rel="stylesheet" href="../css/ol.css" type="text/css">
       <script src="../jslib/ol.js"></script>


    </head>
    <body>
        <div id="map" class="map" style="height: 80%;">

        </div>
          <label>幾何型別 &nbsp;</label> 

          <select id="type">
            <option value="Point">Point</option>
            <option value="LineString">LineString</option>
            <option value="Polygon">Polygon</option>
            <option value="Circle">Circle</option>
          </select 
>
        <script>
            var raster=new ol.layer.Tile({
                source:new ol.source.OSM()
            });

            var source=new ol.source.Vector();

            var vector=new ol.layer.Vector({
                source:source,
                style:new ol.style.Style({
                    fill:new ol.style.Fill({
                         color: 'rgba(255, 255, 255, 0.2)'
                    }),
                    stroke:new ol.style.Stroke({
                        color:'#000',
                        width:5
                    }),
                    image:new ol.style.Circle({
                        radius:7,
                        fill:new ol.style.Fill({
                            color:"#F00"
                        })
                    })
                })
            });

            var map=new ol.Map({
                layers:[raster,vector],
                target:"map",
                view:new ol.View({
                    center:[0,0],
                    zoom:4
                })
            })

            var modify=new ol.interaction.Modify({source:source});
            map.addInteraction(modify);
            var draw=null;
            var snap=null;
            function addInteractions(){
                draw=new ol.interaction.Draw({
                    source:source,
                    type:$("#type").val()
                });
                map.addInteraction(draw);
                snap=new ol.interaction.Snap({
                    source:source
                });
                map.addInteraction(snap);
            }
            //選擇樣式
            $("#type").change(function(){
                map.removeInteraction(draw);
                map.removeInteraction(snap);
                addInteractions();
            });
            addInteractions();//預設為點樣式


            map.on("click",function(e){
                alert(e.coordinate);
                alert(ol.proj.transform(e.coordinate, 'EPSG:3857', 'EPSG:4326'));
                // 通過getEventCoordinate方法獲取地理位置，再轉換為wgs84座標，並彈出對話方塊顯示
                alert(map.getEventCoordinate(e.originalEvent));
                alert(ol.proj.transform(map.getEventCoordinate(e.originalEvent), 'EPSG:3857', 'EPSG:4326'));

                var lonlat = map.getCoordinateFromPixel(e.pixel);
                alert(lonlat);
                alert(ol.proj.transform(lonlat,"EPSG:3857", "EPSG:4326")); //由3857座標系轉為4326
            })

        </script>
    </body>
</html>

OpenLayer4.6.5繪製和編輯要素及獲取定位點

OpenLayer4.6.5繪製和編輯要素及獲取定位點使用OpenLayer4.6.5API 參考資料 openlayers 顯示點選位置的經緯度程式碼如下所示 <!DOCTYPE html> <html> <head

Hadoop 2.6.5 FileSystem和Configuration兩個對象的探究

centos 6.5系統下安裝ibus及設置開機自啟動

系統環境 tails src home 博客技術分享 bus 快捷鍵執行先說一下系統環境：centos 6.5，然後我是以root身份執行的，沒有權限的用戶參見sudo用法第1步：查找並安裝ibus安裝包，命令如下：找到一行： ibus-pinyin.x86_6

Centos 6.5 安裝和使用docker

rain mysql net 三方庫內部 enable default 生產環境 sys 基於本人一貫的習慣，關於“某某某是什麽”這樣的問題，請百度吧，會有更專業的人士，會比我說的更詳細更深，這裏我只給出本人親歷的安裝和使用過程。 1.安裝

EXSI 6.5 添加存儲及擴容

fff 登錄 esxi 兩個新的頁面管理 nag dba 技術配置IP地址 192.168.1.100,掩碼:255.255.255.0用瀏覽器輸入IP地址進行配置管理瀏覽器管理ESXI 配置數據存儲現在可以看到當前的數據存儲為40GB，另外我們要添加20GB的數據存

openlayer 繪製和修改要素

繪製和修改要素 <!DOCTYPE html><html> <head> <title>Draw and Modify Features</title> <link rel="

ElasticSearch5.6.5集群部署及調優、Head和Bigdesk插件安裝

work 指點 app.js 模擬 eas disable firewalld sts 無法一、簡介：Elasticsearch是一個基於Apache Lucene的開源搜索引擎。無論在開源還是專有領域，Lucene可以被認為是迄今為止最先進、性能最好的、功能最全的搜索引

離線環境下redhat7.2已及centOS（7.0版本以上）安裝python3.6以及tensorflow1.5、opencv3.4.5流程和採坑總結

離線環境下redhat7.2已及centOS（7.0版本以上）安裝python3.6以及tensorflow1.5、opencv3.4.5流程和採坑總結序 Tensorflow的安裝環境安裝環境監測離線安裝兩種方式

centos 6.5環境利用iscsi搭建SAN網路儲存服務及服務端target和客戶端initiator配置詳解

一、簡介 iSCSI（internet SCSI）技術由IBM公司研究開發，是一個供硬體裝置使用的、可以在IP協議的上層執行的SCSI指令集，這種指令集合可以實現在IP網路上執行SCSI協議，使其能夠在諸如高速千兆乙太網上進行路由選擇。iSCSI技術是一種新儲存技術，該技術

Elasticsearch Java Client 版本區別及起步(5.X 和6.X)

簡單總結：如果服務端是5.6以下的，選擇相同版本的TransportClient，避免一些API服務端不支援如

centos 6.5下編譯安裝php-7.1.6和 php memcached擴展

php 編譯安裝 memcached 0，安裝 php-7.1.6 依賴包# yum groupinstall "Development tools" "Desktop Platform Development" # yum -y install openssl-devel libcurl-dev

centos 6.5未聯網及設置靜態ip

shel 修改配置文件 dhcp line 初始 ima 網卡配置 ifcfg 連接使用XenCenter在公司服務器安裝了centos6.5，安裝初始化以後是未連接到互聯網的，然後配置虛擬機聯網設置，首先必須保證服務器是連接外網的。這是一臺新裝的虛擬機：首先測試下是否

Linux(centos 6.5) 調用java腳本以及定時運行的腳本實例及配置文件具體解釋

-name entos profile 6.0 主函數 lan 默認 java類屬性 Linux(centos 6.5) 調用java腳本以及定時運行的腳本實例一、調用java程序腳本（默認已經搭建好了Java環境） 1、jdk 安裝路徑 /usr/jdk

Qt5.5.1和Qt5.3.2編譯OCI驅動教程及驗證方法

oracle下載電腦博客 size 版權 ring nbsp scott 所有我們都知道oracle數據庫的強大，並且好多企業或者教學用到數據庫時都會推薦使用。但是Qt因為版權問題沒有封裝oracle數據庫專用驅動，網上也有一大堆說法和教程，但是或多或少的都有問題。下

Xcode9.0+appium1.6.5真機環境運行app及遇坑知多少

xc0de9.0 appium1.6.5 真機測試app ios app真機測試 ios app自動化測試 Mac下把appium自動化環境搭建好後，進行真機測試時會碰到相當多的坑，下面給大家一一列出來並附上解決方法。一、selenium.common.exceptions.WebDr

vSphere 6.5之創建內容庫和虛擬機

內容庫 vsphere虛擬機一、創建內容庫1.VCSA主頁清單如下2.創建內容庫3.指定內容庫的名稱和位置4.配置內容庫，這裏配置為本地內容庫5.添加存儲6.確認內容庫設置7.導入項目8.導入庫項目，這裏導入本地文件二、創建虛擬機1.創建虛擬機2.選擇創建類型3.為虛擬機命名並選擇虛擬機安裝的所在位置4.選

Centos7 安裝Python3.6.5 及安裝ipython 6.1.0

Python3.6.5安裝 Ipython6.1.0安裝一、centos7 安裝 Python3.6.5教程1、在安裝Python之前，需要先安裝一些後面遇到的依賴問題（如果有依賴問題，按照提示安裝）： yum -y install zlib-devel bzip2-devel openssl

Red Hat Enterprise 6.5磁盤分區，LVM管理及磁盤配額設置

磁盤分區 LVM Linux磁盤分區、LVM管理及磁盤配額設置第一部分：磁盤分區為虛擬機添加一塊新的磁盤，重啟生效。管理新添加的sdb磁盤。為其創建不同類型的分區，ext4、fat、及swap。2．1創建第一個主分區2.2創建第二個主分區，方法相同。 2.3將剩下的都劃分為擴展

Linux Redhat 6.5 apache虛擬目錄和多端口多主機名配置

Linux 服務Apache是世界使用排名第一的Web服務器軟件。它可以運行在幾乎所有廣泛使用的計算機平臺上，由於其跨平臺和安全性被廣泛使用，是最流行的Web服務器端軟件之一。它快速、可靠並且可通過簡單的API擴充，將Perl/Python等解釋器編譯到服務器中。 **實驗目標為實現虛擬目錄實現用戶登陸

XEN虛擬化簡介及XEN在CentOS 6.5上的安裝

-m pointf err virtual splash server amd inter linux c 根據之前KVM虛擬化的整理，虛擬化技術分類如下：虛擬化技術的分類： (1) 模擬：Emulation Qemu, PearPC, Bochs

OpenLayer4.6.5繪製和編輯要素及獲取定位點

OpenLayer4.6.5繪製和編輯要素及獲取定位點

相關推薦