openlayers之点,线,面(以城市,河流,省份为例,分别对应点线面)
kpst._this这里指向初始化的map
// 设置标注样式函数
function createStyle(name) {
// 河流style
var riverStyle = new Style({
stroke: new Stroke({
color: '#4e89d4',
width: 2
}),
fill: new Fill({
color: '#eee'
})
})
// 省份style·
var provinceStyle = new Style({
stroke: new Stroke({
color: '#4e89d4',
width: 1
}),
fill: new Fill({
color: '#eee'
})
})
//城市style·
if (name != '') {
var cityStyle = new ol.style.Style({
image: new ol.style.Circle({
radius: 5,
fill: new ol.style.Fill({
color: '#05ab57',
}),
stroke: new ol.style.Stroke({
color: '#05ab57',
width: 1
}),
}),
text: new ol.style.Text({
textAlign: "center", // 位置
textBaseline: "top", // 基准线
font: "normal 12px 微软雅黑", // 文字样式
text: name,
fill: new ol.style.Fill({
color: "#333",// 文本填充样式(即文字颜色)
}),
stroke: new ol.style.Stroke({
color: "#Fff",
}),
zIndex: 9
})
})
}
return {
riverStyle,
provinceStyle,
cityStyle
}
}
//创建图层
function creatlayer(name) {
var layer
if (name != 'city') {
layer = new VectorLayer({
name: name,
source: new VectorSource({
// 地图的坐标系是CGCS2000,json数据也要是CGCS2000
features: (new GeoJSON()).readFeatures(require("../../assets/data/" + name + '.json'))
}),
style: createStyle()[name + 'Style']
});
} else {
var features = (new GeoJSON()).readFeatures(require("../../assets/data/city.json"))
for (let i = 0; i < features.length; i++) {
const feature = features[i];
feature.setStyle(createStyle(feature.get("NAME")).cityStyle)
}
layer = new VectorLayer({
name: name,
source: new VectorSource({
features: features
})
})
}
kpst._this.addLayer(layer);
return layer
};
// 将图层加载到地图,并将所加图层赋给地图的某个对象
function layerFx(name) {
kpst._this[name] = creatlayer(name)
}
// 将图层加载函数挂载到地图
kpst._this.layerFx = layerFx
openlayers之点,线,面(以城市,河流,省份为例,分别对应点线面)的更多相关文章
- 一个简单客户端获取IP,国家,城市,省份的代码
<html><head> <script src="js/jquery-1.6.2.min.js" type="text/javascri ...
- vue父组件获取子组件页面的数组 以城市三级联动为例
父组件调用子组件 <Cselect ref="registerAddress"></Cselect> import Cselect from '../../ ...
- Geoserver基本使用、WMS服务发布与OpenLayers测试
1.Geoserver与OpenLayers的下载 Geoserver:http://geoserver.org/ OpenLayers:http://openlayers.org/ 2.安装部署Ge ...
- asp.net mvc jQuery 城市二级联动
页面效果图: 数据库表结构: 首先在数据库中创建省级.城市的表,我的表如下:我用了一张表放下了省级.城市的数据,用level划分省份和城市,parentId表示该城市所在省份的id 主要文件有:ind ...
- 通过jquery 获取用户当前所在的城市名称和IP地址
下面这段JS代码是通过jquery 结合新浪IP地址库和QQip地址库接口获取用户当前所在的城市(省份)名称. 用户当前IP地址等数据.其中当前IP是通过 QQip地址库接口获取,其他数据都是通过 新 ...
- P1841 [JSOI2007]重要的城市
题目描述 参加jsoi冬令营的同学最近发现,由于南航校内修路截断了原来通向计算中心的路,导致去的路程比原先增加了近一公里.而食堂门前施工虽然也截断了原来通向计算中心的路,却没有使路程增加,因为可以找到 ...
- talib 中文文档(十二):Pattern Recognition Functions K线模式识别,形态识别
Pattern Recognition Functions K线模式识别,形态识别 CDL2CROWS - Two Crows 函数名:CDL2CROWS 名称:Two Crows 两只乌鸦 简介:三 ...
- Ta-lib K线模式识别
1, CDL2CROWS (Two Crows 两只乌鸦) 简介:三日K线模式,第一天长阳,第二天高开收阴,第三天再次高开继续收阴,收盘比前一日收盘价低,预示股价下跌. 例子:integer = CD ...
- 使用JavaScript数组实现省份和城市的级联菜单
查看本章节 查看作业目录 需求说明: 使用数组实现省份和城市的级联菜单.具体要求如下 在页面中添加城市时,根据选择的省份,动态地添加该省份的城市 页面加载完毕后,第一个列表框填充"两湖两广& ...
随机推荐
- java加密算法相关
简介 RSA公钥加密算法是1977年由罗纳德·李维斯特(Ron Rivest).阿迪·萨莫尔(Adi Shamir)和伦纳德·阿德曼(Leonard Adleman)一起提出的.1987年首次公布,当 ...
- Winform使用ML.NET时无法加载 DLL“CpuMathNative”问题的解决方法
同样的代码运行在netcore下可以,运行在winform中就出现错误: 引发的异常:“System.DllNotFoundException”(位于 Microsoft.ML.Data.dll 中) ...
- leetcode124二叉树最大路径和
第一选择是将其转化成图用动态规划,但这样还是太麻烦 使用递归的思路,对于当前的节点root,分别求左右孩子到当前节点的单项路径权值最大的路径权值,然后记包含当前节点的路径权值为 path_price= ...
- [go]beego获取参数/返回参数
获取前端传来的参数 获取数据并转为对应的类型 - ?id=111&id=122 c.GetInt("id") int,111 - ?id=111&id=122 c. ...
- [go]os.Open方法源码
file, err := os.Open("./buf.go") func Open(name string) (*File, error) { return OpenFile(n ...
- javascript之日期对象(Date)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- html+xml+servlet 通讯录案例demo
首先导入dom4j和xPath技术以及测试对应的jar包 package com.loaderman.demo.entity; /** * 实体对象 * @author APPle * */ publ ...
- 使用jQuery做简单的图片轮播效果
一.本特效主要用到的前端知识点 CSS中绝对定位(absolute)CSS实现垂直居中jQuery中简单的淡入淡出动画效果(fadeIn,fadeOut)定时器(setInterval,clear ...
- mysql知识点汇集
1.将两个表字段类型一致的数据合并到一个新表的命令. INSERT into new_table(user_name,password,age) SELECT user_name,password,a ...
- 七十八:flask.Restful之flask-Restful标准化返回参数以及准备数据
对于一个视图函数,可以指定好数据结构和字段用于返回,以后使用ORM模型或者自定义的模型的时候,它会自动获取模型中相应的字段,生成json数据,然后再返回给前端,这需要导入flask_restful.m ...