1、npm install esri-leaflet --save

2、引入包

import Leaflet from "leaflet";

var esri = require("esri-leaflet");
 

3、添加底图

esri.basemapLayer("Topographic").addTo(this.map);
4、添加动态服务
 
esri.dynamicMapLayer({
url:"https://services.arcgisonline.com/arcgis/rest/services/Specialty/Soil_Survey_Map/MapServer",
opacity: 0.7
})
.addTo(this.map);

【GIS】Vue esri-leaflet的更多相关文章

  1. 【GIS】Vue、Leaflet、highlightmarker、bouncemarker

    感谢: https://github.com/brandonxiang/leaflet.marker.highlight https://github.com/maximeh/leaflet.boun ...

  2. 【GIS】Vue修改图层透明度

    1.添加透明度控制条 <input id="slider" type="range" min="0" max="1" ...

  3. 【GIS】postgres(postgis) --》nodejs+express --》geojson --》leaflet

    一.基本架构 1.数据存储层:PostgreSQL-9.2.13 + postgis_2_0_pg92 2.业务处理层:Nodejs + Express + PG驱动 3.前端展示层:Leaflet ...

  4. 【1】vue/cli 3.0 脚手架 及cube-ui 安装

    安装 Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+).你可以使用 nvm 或 nvm-windows在同一台电脑中管理多个 Node 版本. 检查node版本: $ ...

  5. 【转】Vue.js:轻量高效的前端组件化方案

    摘要:Vue.js通过简洁的API提供高效的数据绑定和灵活的组件系统.在前端纷繁复杂的生态中,Vue.js有幸受到一定程度的关注,目前在GitHub上已经有5000+的star.本文将从各方面对Vue ...

  6. 【05】Vue 之 实例详解与生命周期

    Vue的实例是Vue框架的入口,其实也就是前端的ViewModel,它包含了页面中的业务逻辑处理.数据模型等,当然它也有自己的一系列的生命周期的事件钩子,辅助我们进行对整个Vue实例生成.编译.挂着. ...

  7. 【可视化】Vue基础

    作者 | Jeskson 来源 | 达达前端小酒馆 Vue简介 Vue框架,框架的作者,尤雨溪,组件化,快速开发的特点. 生命周期 beforeCreate:组件刚刚被创建 created:组件创建完 ...

  8. Vue学习笔记【23】——Vue组件(组件的定义)

    定义Vue组件 什么是组件: 组件的出现,就是为了拆分Vue实例的代码量的,能够让我们以不同的组件,来划分不同的功能模块,将来我们需要什么样的功能,就可以去调用对应的组件即可: 组件化和模块化的不同: ...

  9. 【前端】Vue和Vux开发WebApp日志四、增加命令行参数

    转载请注明出处:http://www.cnblogs.com/shamoyuu/p/vue_vux_4.html 项目github地址:https://github.com/shamoyuu/vue- ...

随机推荐

  1. JNI编程实现(Windows)

    上一篇介绍了Linux平台的JNI编程方法,Windows平台的JNI本地调用基本类似,区别就是制作的动态库不同,Linux平台是*.so,Windows平台是*.dll.其中,Windows平台的函 ...

  2. 使用 IntraWeb (36) - TIWServerControllerBase

    每个应用须有且只有一个 Server Controller. TIWServerControllerBase 所在单元及继承链: IWServerControllerBase.TIWServerCon ...

  3. 查看 Mac/Linux 某端口占用情况

    Mac/Linux 平台下,通用命令: lsof -i:8080  (8080 为 端口号,根据需要,替换为其他端口号) 可以查看该端口被什么程序占用,并显示 pid,方便 kill 掉 Linux如 ...

  4. 4、搭建Python环境

    搭建Python环境 Linux环境 大多Linux发行版均默认安装了Pthon环境.如想下载不同的版本,可到www.python.org下载.软件安装方法参照Linux软件安装. 输入Python可 ...

  5. android 获得View的高度

      在一个activity中有一个textview,设置字数不同,如何能在打开这个activity时就及时获得这个textview在activity的高度,有利于我对textview的高度进行设置. ...

  6. php write_ini_file

    php读ini文件有很方便的pares_ini_file,但是写回去却没有,这里写一个: function write_ini_file($assoc_arr, $path, $has_section ...

  7. android中webView加载H5,JS不能调用问题的解决

    使用了html5 页面,使用webView加载后发现 超链接的锚点不可以用 为webView设置下面两句就好了: mWebView.getSettings().setDomStorageEnabled ...

  8. [剑指Offer]5.二维数组中的查找

    题目 在一个二维数组中,每一行都依照从左到右递增的顺序排序,每一列都依照从上到下递增的顺序排序.请完毕一个函数,输入这种一个二维数组和一个整数.推断数组中是否含有该整数. 思路 [算法系列之三十三]杨 ...

  9. [转]Greenplum 执行计划之广播与重分布

    关联数据在不同节点上,对于普通关系型数据库来说,是无法进行连接的.关联的数据需要通过网络流入到一个节点中进行计算,这样就需要发生数据迁移.数据迁移有广播和重分布两种.在GP中,每一个广播或重分布会产生 ...

  10. 基础007_FIFO原理

    作者:桂. 时间:2018-05-13  05:51:13 链接:http://www.cnblogs.com/xingshansi/p/9030879.html 前言 主要梳理FIFO的特性,fif ...