惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

Exploit-DB.com RSS Feed
Exploit-DB.com RSS Feed
A
About on SuperTechFans
IT之家
IT之家
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
Blog — PlanetScale
Blog — PlanetScale
aimingoo的专栏
aimingoo的专栏
云风的 BLOG
云风的 BLOG
The GitHub Blog
The GitHub Blog
Vercel News
Vercel News
G
Google Developers Blog
J
Java Code Geeks
宝玉的分享
宝玉的分享
T
Tailwind CSS Blog
Cloudbric
Cloudbric
L
LINUX DO - 最新话题
MyScale Blog
MyScale Blog
H
Heimdal Security Blog
PCI Perspectives
PCI Perspectives
Attack and Defense Labs
Attack and Defense Labs
S
Security @ Cisco Blogs
Latest news
Latest news
I
Intezer
L
Lohrmann on Cybersecurity
C
CXSECURITY Database RSS Feed - CXSecurity.com
月光博客
月光博客
T
Threatpost
博客园 - 【当耐特】
S
Schneier on Security
P
Privacy International News Feed
G
GRAHAM CLULEY
T
Tenable Blog
AWS News Blog
AWS News Blog
Threat Intelligence Blog | Flashpoint
Threat Intelligence Blog | Flashpoint
雷峰网
雷峰网
博客园 - Franky
Engineering at Meta
Engineering at Meta
美团技术团队
S
Secure Thoughts
T
Troy Hunt's Blog
Microsoft Security Blog
Microsoft Security Blog
SecWiki News
SecWiki News
V
Visual Studio Blog
人人都是产品经理
人人都是产品经理
Application and Cybersecurity Blog
Application and Cybersecurity Blog
Cisco Talos Blog
Cisco Talos Blog
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
Martin Fowler
Martin Fowler
Webroot Blog
Webroot Blog
Google DeepMind News
Google DeepMind News
H
Hackread – Cybersecurity News, Data Breaches, AI and More

博客园 - dataxiu.com

[原创.数据可视化系列之十三]idw反距离权重插值算法的javascript代码实现 [原创.数据可视化系列之十二]使用 nodejs通过async await建立同步数据抓取 [原创.数据可视化系列之八]使用等d3进行灰度图转伪彩色 [原创.数据可视化系列之七]阿里竞赛作品技术展示 [原创.数据可视化系列之五]韩国"萨德"系统防御图 [原创.数据可视化系列之四]跨平台,多格式的等值线和等值面的生成 [原创.数据可视化系列之三]使用Ol3加载大量点数据 [原创.数据可视化系列之二]使用cesium三维地图展示美国全球军事基地分布 [原创.数据可视化系列之一]使用openlayers 3 显示聚合数据 管理类软件的界面模板。 使用SilverLight开发ARPG游戏(一) 买联想学生机器的遭遇:问联想1(连载) 联想09年春节学生机开卖了。 谈UrlRewriter在XP和2003上IIS设置的差异 使用SilverLight构建插件式应用程序(九) —聊天插件客户端的实现 .NET 访问JAVA的WebService使用SOAP头 使用SilverLight构建插件式应用程序(八) —聊天插件Duplex WCF的实现 使用SilverLight构建插件式应用程序(七) 使用SilverLight构建插件式应用程序(六)
[原创.数据可视化系列之六]使用openlyaers进行公网地图剪切
dataxiu.com · 2016-09-23 · via 博客园 - dataxiu.com

进行地图开发的过程中,我一般使用天地图或者微软的地图作为地图,因为这两种地图的经纬度偏差最小,基本可以满足用户需求,比如:

不用说,都是全部地图,这也是最常用的一种方法。

但是用户说,我只看大连的地图,就要大连这一块。这样需要一个整个大连地区的面,使用这个面去切地图,结果就可以了,如下图:

这样的图有点类似自己的发布的图。切图代码原理openlayers 3例子参见:

 http://openlayers.org/en/latest/examples/layer-clipping.html?q=clip

var style = new ol.style.Style({
fill: new ol.style.Fill({
color: 'black'
})
});

var clipLayer = new ol.layer.Image({
source: new ol.source.ImageVector({
source: new ol.source.Vector({
url: '//openlayers.org/en/v3.14.2/examples/data/geojson/countries.geojson',
format: new ol.format.GeoJSON()
}),
style: style
})
});
clipLayer.on('postcompose', function(e) {
e.context.globalCompositeOperation = 'source-over';
});
clipLayer.on('precompose', function(e) {
e.context.globalCompositeOperation = 'destination-in';
});

var map = new ol.Map({
layers: [
new ol.layer.Tile({
source: new ol.source.MapQuest({layer: 'sat'})
}),
clipLayer
],
target: 'map',
view: new ol.View({
center: [0, 0],
zoom: 1
})
});