leaflet 學習備忘

阿新 • • 發佈：2019-01-17

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>leaflet</title>
    <link href="https://cdn.bootcss.com/leaflet/1.3.1/leaflet.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js" 
></script>
    <script src="https://cdn.bootcss.com/leaflet/1.3.1/leaflet.js"></script>
    <style>
    html,body{
        margin:0;
        padding:0;
        width:100%;
        height:100%;
        overflow:hidden;
    }
    </style>
</head>
<body>

<!-- 
地圖容器-->
<div style="width:100%;height:100%;font-size:12px" id="map"></div>
<script>

var subdomains = ['0', '1', '2', '3', '4', '5', '6', '7'];
var layerList = {
    '道路地圖':L.layerGroup([
        L.tileLayer('http://t{s}.tianditu.cn/DataServer?T=vec_w&X={x}&Y={y}&L={z} 
', {subdomains: subdomains}),
        L.tileLayer('http://t{s}.tianditu.cn/DataServer?T=cva_w&X={x}&Y={y}&L={z}', {subdomains: subdomains}),
    ]),
    '影像地圖':L.layerGroup([
        L.tileLayer('http://t{s}.tianditu.cn/DataServer?T=img_w&X={x}&Y={y}&L={z}', {subdomains: subdomains}),
        L.tileLayer('http://t{s}.tianditu.cn/DataServer?T=cva_w&X={x}&Y={y}&L={z}', {subdomains: subdomains}),
    ]),
    'OpenStreet':L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png?{foo}', {foo: 'bar'}),
    "ArcGIS": L.tileLayer('http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer/tile/{z}/{y}/{x}',{  
        maxZoom: 18,  
        reuseTiles: true
    }),
    "osm": L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png'),
    
    "google_m": L.tileLayer('http://{s}.google.cn/maps/[email protected]&hl=zh-CN&gl=CN&src=app&y={y}&x={x}&z={z}&s=Ga',{
        maxZoom: 20,
        subdomains:['mt0','mt1','mt2','mt3']
    }),
    "google_Streets": L.tileLayer('http://{s}.google.cn/maps/[email protected]&gl=cn&x={x}&y={y}&z={z}',{
        maxZoom: 20,
        subdomains:['mt0','mt1','mt2','mt3']
    }),
    "google_Hybrid": L.tileLayer('http://{s}.google.cn/maps/vt?lyrs=s,[email protected]&gl=cn&x={x}&y={y}&z={z}',{
        maxZoom: 20,
        subdomains:['mt0','mt1','mt2','mt3']
    }),
    "google_Satellite": L.tileLayer('http://{s}.google.cn/maps/[email protected]&gl=cn&x={x}&y={y}&z={z}',{
        maxZoom: 20,
        subdomains:['mt0','mt1','mt2','mt3']
    }),
    "google_Terrain": L.tileLayer('http://{s}.google.cn/maps/[email protected]&gl=cn&x={x}&y={y}&z={z}',{
        maxZoom: 20,
        subdomains:['mt0','mt1','mt2','mt3']
    }),
};

var map = L.map("map", {
    center:[34,109],
    zoom: 5,
    layers: layerList['道路地圖'],
    zoomControl: true
});

L.control.scale({imperial:false}).addTo(map);
L.control.layers(layerList, null).addTo(map);

L.marker([34.2609052589,108.9423344082]).addTo(map);

var imageUrl = 'http://i2.hexunimg.cn/2016-03-09/182664922.jpg',
    imageBounds = [[34, 108], [33, 109]];
L.imageOverlay(imageUrl, imageBounds).addTo(map);

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

leaflet 學習備忘

<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>leafl

Android學習備忘箋01Activity

存在 images 布爾 edi pan start clas 設置 pro 01.設置視圖　　在Android Studio新建的項目中，通過 setContentView(R.layout.activity_main);方法將res/layout/activity_m

halcon學習備忘二（影象相減運算元）

在我們編寫halcon程式中可能常會用到影象相減運算元sub_image，例如在做高斯高通濾波的時候，最後的結果是要用原影象減去濾波後的影象才能得到銳化影象。該運算元的引數形式如下： sub_image(ImageMinuend , ImageSubtrahend : Im

STM32與FreeRTOS學習備忘，xSemaphoreGiveFromISR

在學習FreeRTOS的時候，使用中斷釋放訊號量時，出現了問題。中斷函式卡在xSemaphoreGiveFromISR();函式裡了，具體是卡在portASSERT_IF_INTERRUPT_PRIORITY_INVALID();裡。根據註釋檢視http://www.

HTTP學習備忘。

GET /demo01 HTTP/1.1 Host: localhost:9090 Connection: keep-alive Cache-Control: max-age=0 Upgrade-Insecure-Requests: 1 User-Agent

Halcon學習備忘六（擬合圓的一種方法）

對於圓形區域，我們想擬合出它的圓形輪廓或者其他的圓，我們可以用如下的方法擬合出來：（1）、如果該區域是一個圓環區域的話，那就執行骨架運算元skeleton得到圓環區域的骨架，然後用gen_contours_skeleton_xld生成骨架輪廓。如果該區域是圓形區域，那麼可

JavaScript學習備忘

除法替換捕捉值類型 name 開發針對 UNC 節點 1.您只能在 HTML 輸出流中使用 document.write 如果在文檔已加載後使用它（比如在函數中），會覆蓋整個文檔 2.數組 : [40, 100, 1, 5, 25, 10] <====>

numpy 學習筆記（備忘）

dom size -- 就是 numpy imp int code inf 切片和索引 import numpy as np a = np.random.randint(low=1, high=10, size=(3, 3, 2)) print(‘----------a-

備忘參考學習網址

rapidjson: 高效的C++ json 解析/生成器，參考使用學習文件地址：http://rapidjson.org/zh-cn/md_doc_tutorial_8zh-cn.html opencv:開源的計算機視覺庫，參考學習地址：http://www.opencv.org.cn/op

ubuntu深度學習keras程式設計常用的幾條語句記錄備忘

實時監控GPU溫度： watch -n 0.5 nvidia-smi -q -i 0,1 -d TEMPERATURE （每0.5秒重新整理一次）消除因為跑GPU帶來的CPU加速警告： import os os.environ['TF_CPP_MIN_LOG_L

【備忘】我的Python學習筆記，第一期

# -*- coding: UTF-8 -*- # 預設情況下，Python 3 原始碼檔案以 UTF-8 編碼，所有字串都是 unicode 字串 print("Hello, World!") # print ("你好,世界"); # Python中單行註釋以 # 開頭 #

【備忘】python神經網路演算法與深度學習視訊

先準備好一個大硬碟，照著這個學習路線學習！站長也在學習這個教程，沿著數學->演算法->機器學習->資料探勘（分析）->人工智慧的學習路線學習。第00_安裝包、開發工具、註冊（贈品）第01階段-基礎必備篇 python3.6視訊零基礎2周快速

【備忘】從基礎到深度學習OpenCV視訊教程計算機視覺影象識別實戰Python C C++

├─第01講工欲善其事必先利其器-影象處理基礎 │ cv第一次資料.rar │ 第一課.mkv │ ├─第02講初探計算機視覺 │ cv_第一二講.pdf │ cv第二次資料.rar │ 第二課.mkv │

Flask學習3 備忘

在python中，json物件是一個字串型別，要從json中取資料，需要先將json轉換成dic： 1、json.dumps()和json.loads()是json格式處理函式（可以這麼理解，json是字串）　　(1)json.dumps()函式是將一個Python資料型別列表進行

【備忘】Java菜鳥到大牛學習路線培訓教程

這是一套Java菜鳥到大牛學習路線培訓教程，由本站工作了10年的資深Java架構師整理。主要分5個階段：Java程式設計師->Java初級軟體工程師->Java中級軟體工程師->Java高階軟體工程師->Java系統架構師，從頭學到尾即可成為大神！

【備忘】最新小象學院機器學習升級版III 視訊教程下載

課程大綱：課時1：機器學習應用實驗手冊第1 章：第一週課件資料和視訊課時2：1.機器學習與數學分析課時3：視訊-1.機器學習與數學分析課時4：2.概率論與貝葉斯先驗課時5：視訊-2.概率論與貝葉斯先驗

【備忘】學習路線之JavaEE系統架構師實戰篇系列視訊教程

1初級篇 J2SE的Socket網路程式設計應用 J2SE的反射機制高階應用 J2SE高深講解 JAVA程式設計思想初級教程[MP4] JAVA程式設計思想高階教程[MP4] JAVA程式設計思想中級教程[MP4]

【備忘】JavaEE系統架構師學習路線之實戰篇

1初級篇 J2SE的Socket網路程式設計應用 J2SE的反射機制高階應用 J2SE高深講解 JAVA程式設計思想初級教程[MP4] JAVA程式設計思想高階教程[MP4]

【備忘】大資料學習從菜鳥到精通學習路線視訊教程

01.第一階段大資料必備linux基礎與實戰 02.第二階段大資料hadoop家族架構實戰 03.第三階段大資料實時分析Storm入門到精通 04.第四階段新一代大資料Spark平臺實戰 05.第五階段知名公司大資料專案實戰

【備忘】JavaEE系統架構師學習路線圖

轉載自：http://www.javaxxz.com/thread-286706-1-1.html 第1階段(Java程式設計師) - Java語言基礎 -01-常見Dos命令、Java歷史、Java跨平臺、配置Path環境變數、第一個HelloWor

leaflet 學習備忘

相關推薦