当前搜索:

[置顶] OpenLayer3 之 实现拉框放大功能

几天前,有人给我发邮件询问如何实现划定一个矩形区域实现放大功能,即所谓的“拉框放大”,在 ol3 中,其实已有实现鼠标拖拽放大地图功能,默认需要配合 shift,按住shift,拖拽鼠标的同时,地图会放大,该组件名为 ol.interaction.DragZoom,该组件的缺点是不实用(哪一个非专...
阅读(2712) 评论(4)

[置顶] GIS 矢量切片(Vector Tile)-地图定制化的时代已经悄悄来临

前言 切片技术的简单介绍,以及传统栅格图片切片的不足 现在最流行的地图底图技术是栅格切片底图,它们本质上是将空间数据分别渲染为不同缩放级别的地图图片,然后将各个级别的图片按照一定规则切分,按照一定的 “规则组织”,存储到硬盘或数据库中,构成一幅完整的地图。 图1 切片概念图相对于其他技术,切...
阅读(10479) 评论(16)

[置顶] GIS 算法 之 拉默-道格拉斯-普克算法(ramer-douglas-peucker)

如今的 GIS 应用离不开互联网,即 “WebGIS”,GIS 一个显著的特点就是数据量大,数据异构,因此在网络中传输数据成为了影响 WebGIS 应用性能的瓶颈。在 Web 浏览器的应用中尤为明显,浏览器下载数据时,等待时间过长,会造成浏览器假死现象。如何减小数据量,用小的数据量做出类似的大数据...
阅读(2930) 评论(0)

[置顶] OpenLayers3 在 Mac 视网膜屏下的响应式设计

PPI,DPI与window.devicePixelRatio 在谈这个主题之前,首先得明确两个概念:DPI、PPI,首先他们都表示图片的分辨率,其次它们有不同: DPI,Dots Per Inch,表示每英寸有多少个点,是打印的术语; PPI,Pixel Per Inch,表示每英寸有多少...
阅读(1431) 评论(1)

[置顶] ES5 中的面向对象编程前传 之 深刻理解原型链(prototype)

你懂了原型链了吗?原型链就是对象的 `__proto__` 指针属性连接的对象继承链。既然 JavaScript 本身可以这么做,那为什么我们不可以这样做呢?我们也可以利用这种模式实现继承,但是这种继承只能继承父对象 `prototype` 中的属性和方法,由各个实例共享,那你是不是突然想起我们上...
阅读(612) 评论(0)

[置顶] ES5 中的面向对象编程前传 之 深刻理解函数

ES5 是现行的 JavaScript,ES6 是 JavaScript 的 2015年版本,现在还没有广泛使用,不过也不远了,这篇文章中我们理解一下 ES5 中的面向对象模拟实现的两个基本技术(函数和原型链)之一:函数,在 JavaScript 中,函数比较难理解,和其它的编程语言中的函数有很多...
阅读(706) 评论(0)

[置顶] Flexbox 布局 与 常见布局需求实现对比

Flexbox 布局是 CSS 3 新增的*布局*模式,在 display 中的值是 `display: flex; display: inline-flex;`。flex 具有很好的适应性,在电脑浏览器和手机浏览器中都有很好的表现。虽然其标准仍然是“候选(CR)”,但是在各个浏览器已经得到了很广...
阅读(5836) 评论(0)

[置顶] Node-mysql 之 使用流重构程序

流(stream)最适合的就是进行大量的查询,对得到的记录进行 IO 操作,防止内存不够用的场景。因为在 Node 中, IO 操作是异步的,因此就会造成大量 IO 的堆积,势必造成内存的占用,这对其他的脚本(比如PHP)也许不是问题,但是 Node 不行,Node 是基于 V8 的,V8 在 6...
阅读(847) 评论(0)

[置顶] Web前端 之 CommonJS 模块化规范与Node实现

上一篇文章中,我们主要介绍了AMD规范的实现RequireJS对前端模块化做出的努力,RequireJS更适合前端的JavaScript,而CommonJS更适合作为后端脚本的JavaScript,所以RequireJS在浏览器端的应用非常火热,并且名噪一时,而作为后端JavaScript的代表N...
阅读(1776) 评论(0)

[置顶] Web前端 之 RequireJS

随着互联网的发展,浏览器端的应用越来越多,单个应用规模越来越大,逻辑也越来越复杂,从最初的页面动态效果,到与服务器异步通信,也就是以AJAX为代表的通信技术,允许在不刷新页面的情况下动态请求服务器的服务,再到复杂的交互,使得JavaScript代码里剧增,因此,代码如何有效组织容易维护,如何应对需...
阅读(734) 评论(0)

[置顶] OpenLayers 3 之 添加地图鼠标右键菜单

添加鼠标右键菜单,首先我们要监听鼠标右键点击的操作,我们知道鼠标右键事件名是 `contextmenu`,当鼠标在 html 元素之上,点击鼠标右键,便会触发 `contextmenu` 事件,在 `contextmenu` 事件的回调函数中实现相应的显示菜单功能即可。那么在 openlayers...
阅读(5654) 评论(0)

[置顶] OpenLayers 3 之 扩展自定义控件--以切换图层控件为例

openlayers 中的控件,是一个固定在页面某个位置的可见的DOM元素,它们可能包含可操作的按钮,也可能只是单纯的展示信息,它们的位置及其样式是由与其关联的CSS样式决定的。默认情况下,它们都位于一个CSS 类(class)为`ol.overlaycontainer-stopevent`的元素...
阅读(6179) 评论(0)

[置顶] OpenLayers 3 之 切换图层控件

在 openlayers 2中,是默认有切换图层控件的,但是由于某种原因,openlayers 3中并没有默认实现,但却给我们很容易扩展的基类(ol.control.Control),我们可以自定义实现,并不是很难,这我会在其他文章中讲解。这篇文章中,我利用一个 GitHub 中的一个开源项目(这...
阅读(5179) 评论(3)

[置顶] OpenLayers 3 之 动态点扩散效果

当某个地方发生一些事情之后,如果我们添加一个静态点在地图上,并不能引起注意,那我们可以放置一个动态的点,类似于在水中投入一个石头,水波扩散的效果,象征发生的事件有一定的影响区域,那么,我们如何利用 OpenLayers3 做出这样的效果呢?我们要实现的效果如下图,之前雅安发生过地震,我们在雅安放置...
阅读(7741) 评论(4)

[置顶] OpenLayers 3 之 Overlay(覆盖物)详解

Overlay 从名字看,是覆盖图、覆盖物的意思,主要的用途就是在地图之上再覆盖一层,用以显示额外的可见元素,可见元素一般是 HTML 元素,利用 overlay,可以将可见元素放置到地图的任意位置,形成地图上再浮动一层的效果。例如在地图上相应的坐标放置一个标志,标签,利用 overlay 都可以...
阅读(8475) 评论(3)

[置顶] OpenLayers 3 之 加载天地图

要使用 OpenLayers 3 加载天地图,首先要弄清楚天地图发布的原理,以及遵循的发布规范,上一篇中我们提到了使用 OpenLayers 3 加载百度地图,我们提到一般网络地图为了加快访问速度,都采用缓存切片地图的方式,天地图也不例外,而且原理极其类似,但是其切片的索引组织方式还是有一些不同,...
阅读(12819) 评论(12)

[置顶] OpenLayers 3 之 加载百度地图

很多人想使用 OpenLayers 调用百度地图、腾讯地图等国内地图,本文就讨论一下其可能性和实现原理。我们以百度地图为例,分析其地图调用原理,我们都使用过百度地图,在网速不快的情况下,肯定有过感受,地图是一块一块加载的,从这里我们就可以看出,地图是被切成了很多块的小图片,调用时按照一定规则请求需...
阅读(17087) 评论(8)

[置顶] OpenLayers 3 之 绘制图形(ol.interaction.Draw)原理解析

在 OpenLayers 3 中,负责交互的模块中,有一个负责绘制图形的交互模块,这个交互子模块是 ol.interaction.Draw。该模块允许用户通过鼠标点击(PC浏览器环境)或者手指触摸( 触屏手机浏览器环境)在地图上绘制点、线 和 面,上一篇文章 中主要介绍了绘制功能的用法,这次我们看...
阅读(8977) 评论(4)

[置顶] OpenLayers 3 之 绘制图形(ol.interaction.Draw)详解

在地图上绘制各种各样的矢量图形,很多应用场景都需要用到,比如可以实现在客户端勾绘矢量图形并将结果保存到数据库以待后续编辑和可视化等等很多有用的功能。这次我们看看怎么利用 OpenLayers 3 绘制各种各样的图形,并添加到图层显示。在 OpenLayers 3 中负责绘制任务的是 ol.inte...
阅读(11366) 评论(6)

[置顶] OpenLayers 3 之 地图矢量图层(ol.layer.Vector)详解

在 GIS 中,地图一般分为两大类:栅格地图和矢量地图,栅格地图其实就是数码照片,只不过有的是卫星拍的。它们有一个共同特征,就是它们都是由很多个像素组成,像素大小是一致的,行高和列宽是一致的,从这个角度看,一幅遥感影像就像栅格。      矢量地图,是由很多要素组成的,每个要素都有自己的地理坐标,...
阅读(10021) 评论(1)
    个人资料
    专栏达人
    等级:
    访问量: 33万+
    积分: 3901
    排名: 1万+
    博客专栏
    最新评论