openlayers3的control中没有提供默认的图层控制控件。

  但是git上已经有造好的轮子,直接拿来用就可以了。地址 https://github.com/walkermatt/ol3-layerswitcher

  直接引用下载的js文件和css文件

 <link rel="stylesheet" type="text/css" href="../static/css/ol3-layerswitcher.css">
<script src="../static/js/ol3-layerswitcher.js"></script>

并且在main.js文件中添加如下两行代码:

var layerSwitcher = new ol.control.LayerSwitcher();
map.addControl(layerSwitcher);

  控件加载后如图,显示的图层名称为添加layer时的title的值;

  控件添加完成。

OpenLayers 3 的 图层控制控件的更多相关文章

  1. OpenLayers在地图外放置控件

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head ...

  2. android 代码控制控件的长宽,小技巧

    要在代码里改变ImageView 的长宽,如图 通过拿到contentImage这对象的控件参数,再去改变,再设置 , 上图的contentImage为ImageView对象: 而这里 要提醒的是,L ...

  3. c# 多线程实现ping 多线程控制控件

    这个备份器放在项目目录下面,每次使用就双击一下,因为便捷性,就不采用xml等等储存信息,全部在面板内做,这样可以保证一个exe就运行了. 我发现运行起来还蛮快的,唯一没有实现的是ping通的电脑如果出 ...

  4. 附加属性来控制控件中,要扩展模块的visibility

    可解决: 文本框控件中的按钮,DataGridColumnHeader中加入Filter控件... cs文件中的 附加属性 + 样式文件中的 template+控件 -> visibility ...

  5. java 随意控制控件的位置

    package chat1; import java.awt.*; import java.awt.event.*; import javax.swing.*; public class chat1{ ...

  6. BPM控制控件的隐藏与显示

    在BPM官方给的属性中控件属性DisplayRule中设置条件控制显示或者隐藏的时候,只能控制选中的,标题也要重新设置,这样就比较麻烦,不如自己来写javascript代码. 举一个简单的例子: 通过 ...

  7. Openlayer 3 图层列表控件(自定义)

    <body><div id="map"></div><div id="layerControl" class=&quo ...

  8. 使用padding值控制控件的隐藏与显示

    在学自定义控件下拉刷新这一案例,控制ListView头条目和尾条目的显示隐藏时,就是设置其padding值的正负控制其的显示与隐藏.这并不是什么很大的知识点.只是一个小技巧,这里给大家分享一下. 这一 ...

  9. js控制控件不可编辑

    js 页面加载执行 function Isedit() { //document.getElementById("SyTxtBox23_DataControl").disabled ...

随机推荐

  1. Thinkpad 拆光驱更换光驱硬盘支架、拆光驱面板 T400 T440

    拆光驱.硬盘装支架的环节就不多说了.主要说下拆光驱面板. 先拿细物(区别针.回形针),捅这个洞,就能把光驱仓打开弹出来后,反过来,这里有个卡扣放大看,按住这卡扣,然后往外掰,把面板掰出来 掰出来的面板 ...

  2. 滴滴Booster移动APP质量优化框架 学习之旅

    推荐阅读: 滴滴Booster移动App质量优化框架-学习之旅 一 Android 模块Api化演练 不一样视角的Glide剖析(一) 一.Booster简介 Booster是滴滴最近开源一个的移动应 ...

  3. Sharepoint2013搜索学习笔记之设置业务数据内容源(六)

    Sharepoint搜索爬网组件支持爬Business Data Connectivity Service 承载的外部数据,关于Business Data Connectivity Service设置 ...

  4. imgAreaSelect插件

    利用jquery的imgAreaSelect插件实现图片裁剪示例 将用户上传的图片进行裁剪再保存是现在web2.0应用中常常处理的工作,现在借助jquery的imgareaselect插件再配合PHP ...

  5. 使用Xilinx SDSoc在Xilinx zcu102开发板上编程HelloWorld

    关于Xilinx SDSoc的介绍我就不再复述了,我理解的也不一定准确,可以阅读官方文档了解SDSoc,你可以把它理解为一个集成开发环境 (IDE),通过SDSoc我们能够简单快速的对Xilinx的开 ...

  6. SpringMVC 静态资源处理

    <!-- 不处理静态内容 --><mvc:default-servlet-handler/><!--前端控制器,哪些静态资源不拦截--><mvc:resour ...

  7. nginx限制恶意IP处理方法

    思考了几种方案,最终考虑使用ip黑名单的方式: 处理方法: 一.nginx黑名单方式: 1.过滤日志访问API接口的IP,统计每10分钟调用超过100次的IP,直接丢进nginx的访问黑名单 2.具体 ...

  8. js new Date("2016-07-01 08:00:00") 格式在IE内核浏览器中显示NaN的问题

    js new Date("2016-07-01 08:00:00") 格式在IE内核浏览器中显示NaN的问题 废话就不多了,var dd = new Date("2016 ...

  9. Python-9-赋值进阶

    1.序列解包 同时给多个变量赋值  >>> x, y, z = 1, 2, 3 >>> print(x, y, z) 1 2 3 用这种方式还可以交换两个变量的值 ...

  10. spingmvc实现在程序启动时调用数据库数据

    直接上代码: package com.java.zxf.servlet; import java.text.ParseException; import java.text.SimpleDateFor ...