openlayers4.0嵌套谷歌地图

2017-06-17
openlayers是开源地图,地图瓦片清晰度和信息都没有商业地图那么完善,在此基础上,套上谷歌地图这一层皮就完美了! 墨卡托投影 OpenLayers 采用的是墨卡托投影,Google Maps也是墨卡托投影,那么在openlayers上显示的坐标和google应该可以是同一种坐标,设备上传的是gps经纬度,首先要把gps的位置显示在ol上,必须转换为ol的坐标系 // 广州珠...

阅读更多

openlayers地图添加标志物

2017-06-14
openlayers是最好的开源地图引擎,我们开发主要在地图上标记兴趣点,画区域,任意图形,运动轨迹等等。在ol地图上画东西其实非常简单,只需要按以下步骤执行 Point point是一个ol坐标点,例如根据经纬度来转为ol对应的坐标 var lonLat = [114.158648, 22.284701]; var transPoint = ol.proj.fro...

阅读更多

apiCloud三种地图切换

2017-06-09
由于项目需要拥有三种地图切换功能,在设置里面配置默认地图,apicloud提供了四种数据存储机制,Local Storage,偏好数据,文件,数据库,local storage是对h5的localStorage的封装,项目使用在对当前app的一些临时数据存储,而一些常用配置,存放在偏好数据,类似于android的sharePerference,接口方法有 api.setPrefs()、api.ge...

阅读更多

extjs跨域请求

2017-06-04
前后端分离架构离不开跨域请求,ext也不例外,ext封装了jsonp模块,相关的有 jsonpStore 和 jsonpProxy 原理 如果有这个请求 Ext.data.JsonP.request({ url : 'foo.php' }); ext会在头部创建一个 script 标签请求 foo.php 路径下的资源(get方法),对应的路径 foo.php?call...

阅读更多

extjs自定义控件实现

2017-05-28
extjs提供了 widget 控件功能,跟组件类似,但是不是基于组件,ext提供的组件满足日常使用,但是要实现一些复杂的小功能,就可以使用widget来实现想要的元素组合功能 ext自带的widget包括 Progress Bar (Ext.Progress or "progressbarwidget") Slider (Ext.sli...

阅读更多

vue服务渲染框架nuxtjs

2017-05-14
nuxtjs简介 nuxtjs是vuejs服务端渲染框架,是一个通用应用构建框架,利用它可以生成vuejs服务端渲染所需的所有配置,集成了vue全家桶,提供了满足日常开发的功能,例如异步数据加载、中间件支持、布局支持等 入门模板 通过模板&nbsp;starter&nbsp;或者通过 vue-cli 来创建项目的框架 vue init nuxt/starter <project-n...

阅读更多

vuejs的slot(插槽)

2017-05-08
vue2出了一个slot(插槽)功能,这个功能是用来干嘛的? 无名slot 我的理解就是一个组件元素里面的内容分发到指定的slot位置,例如,我们有一个模板 <template id="layout-tpl"> <div> <slot><h1>my-comp里面没内容,我显示</h1></slot> ...

阅读更多

extjs6自定义组件

2017-05-07
新的公司并没有用mvvm框架,用的是extjs这个mvc框架,由于之前没接触过,用了一个星期了解了大致的框架,发现extjs用来开发富客户端应用还是很有用的,而且样式统一,组件功能大致齐全,可以满足正常的使用,目前需要做一个时间轴无线滚动效果,发现没适合组件,只得自己开发。 组件定义 组件定义需要继承 Component 这个类 Ext.define('My.custom.C...

阅读更多

搭建静态资源服务器的多种姿势

2017-05-06
现在流行很多mvvm框架,例如reactjs,angularjs,vuejs,还有mvc框架,extjs等,这些项目都可以放到静态资源服务器上,或许第一时间想到的是iis服务器?其实还有下面几种方法 nodejs 利用第三方模块static-server来搭建一个简单的http服务器,全局安装 npm -g install static-server 然后在根目录下执行...

阅读更多

全站webp化!

2017-04-17
WebP,是一种支持有损压缩和无损压缩的图片文件格式,派生自图像编码格式 VP8。根据 Google 的测试,无损压缩后的&nbsp;WebP 比 PNG 文件少了 45% 的文件大小,即使这些 PNG 文件经过其他压缩工具压缩之后,WebP 还是可以减少 28% 的文件大小。 GraphicsMagick GraphicsMagick号称图像处理领域的瑞士军刀。 短小精悍的代码却提供了一个鲁...

阅读更多

了解 em 和 rem 的使用

2017-04-16
设备像素比(device pixel ratio) 设备像素比简称为dpr,其定义了物理像素和设备独立像素的对应关系。它的值可以按下面的公式计算得到: 设备像素比 = 物理像素 / 设备独立像素 在JavaScript中,可以通过window.devicePixelRatio获取到当前设备的dpr。 而在CSS中,可以通过-webkit-device-pixel-ratio,-webkit...

阅读更多

js实用小技巧

2017-04-12
数组排序 利用数组自带的sort方法可以实现排序功能(默认升序),例如这样 var arr = [1,3,6,2,4]; var sortArr = arr.sort(); // [1,2,3,4,6] 如果要降序排序的话,可以这样 var newArr = arr.sort(function(a1, a2) { return a2 - a1; // 后面大于前面的调换,就是降序...

阅读更多