目前,有很多WebGIS开发包,ArcGIS API for JS.OpenLayers.LeafLetjs等为我们从事WebGIS开发的人封装了很多强大的功能.我们很方便的使用这些库的时候,也让我们忽略了很多原理性的东西. 比如说,我之前一直在被一个问题困扰,就是如何将一个点正确的显示在浏览器屏幕的正确的位置,即经纬度坐标和屏幕坐标的转换问题.直到我看到一位大牛的博客(点击学习),里面对WebGIS的原理进行了深入的讲解.看了他的文章后一直觉得,我写这篇文章是多余的.但是大神的文章里面并没有详…
从底层谈WebGIS 原理设计与实现(三):WebGIS前端地图显示之根据地理范围换算出瓦片行列号的原理 1.前言   在上一节中我们知道了屏幕上一像素等于实际中多少单位长度(米或经纬度)的换算方法,而知道这个原理后,接下来我们要怎么用它呢?它和我们前端显示地图有什么关联呢?这一节,我会尽量详细的将这两个问题一一回答.说一个题外话,这一系列的文章我都会少给代码,多画流程图或者UML图来跟大家交流,一来便于没有很多GIS和编程基础的人读懂,二来使大家不局限于某种代码的实现而更关注于原理. 2.影像…
从底层谈WebGIS 原理设计与实现(二):探究本质,WebGIS前端地图显示之地图比例尺换算原理 作者:naaoveGI…    文章来源:http://www.cnblogs.com/naaoveGIS/    点击数:2453    更新时间:2014-9-12 摘要:前面我不厌其烦的给大家说了很多本节的题外话,现在言归正传,我们开始这个系列中的第一个问题,地图比例尺换算原理.想要从底层实现瓦片的显示,我们首先必须了解瓦片本身.我们用arcgis切完图后,打开发布的服务或者打开config…
什么是 XSS 一.XSS 什么是 XSS XSS,即 Cross Site Script , 翻译过来就是 跨站脚本攻击:为了和 css 有所区分,因而在安全领域被称为 XSS. 什么是 XSS 攻击 XSS 攻击指的是 攻击者在网站上注入恶意的客户端代码,通过恶意脚本对客户端网页进行篡改,从而在别的用户浏览网页的 时候,对用户进行控制或者获取 用户对隐私数据的 这么一种攻击手段. XSS 攻击的方式 是什么 XSS 攻击可以分为3类:反射型(非持久型).存储型(持久型).基于DOM. XSS…
# 前端与编译原理 用js去运行js代码 js2run 前端与编译原理似乎相隔甚远,各种热门的框架都学不过来,那能顾及到这么多底层呢,前端开发者们似乎对编译原理的影响仅仅是"抽象语法树",但这只是个开头而已,我们的目的是利用js直接运行js代码 项目地址 安装及使用方法 写这个干嘛,有现成的eval不香么 接触过微信小程序开发的同学或许知道,小程序为运行环境禁止new Function,eval,setTimeout等方法的使用,限制了我们执行字符串形式的动态代码,其他小程序平台对此也…
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.前言 在上一节中我们知道了屏幕上一像素等于实际中多少单位长度(米或经纬度)的换算方法,而知道这个原理后,接下来我们要怎么用它呢?它和我们前端显示地图有什么关联呢?这一节,我会尽量详细的将这两个问题一一回答.说一个题外话,这一系列的文章我都会少给代码,多画流程图或者UML图来跟大家交流,一来便于没有很多GIS和编程基础的人读懂,二来使大家不局限于某种代码的实现而更关…
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.前言 在上一节中我们知道了屏幕上一像素等于实际中多少单位长度(米或经纬度)的换算方法,而知道这个原理后,接下来我们要怎么用它呢?它和我们前端显示地图有什么关联呢?这一节,我会尽量详细的将这两个问题一一回答.说一个题外话,这一系列的文章我都会少给代码,多画流程图或者UML图来跟大家交流,一来便于没有很多GIS和编程基础的人读懂,二来使大家不局限于某种代码的实现而更关…
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.没有豆浆机怎么办? 喝豆浆是我们早晨中基本必备的一环,油条豆浆,其乐融融.如果我问大家豆浆是怎么来的,五谷不分的人会说是用钱买的,了解有黄豆这会事的人会说是用豆浆机把黄豆磨出来的.如果我们再倒退十几年,我相信见到过挑着担子卖豆浆的人就会给出一个更详细的答案了,先用水侵泡黄豆一夜,然后在器皿中充分捣碎,再用中火一直煮,并且要不断搅拌,直至浮沫消失,豆浆才做成了. 听…
说一下前端路由实现的简要原理,以 hash 形式(也可以使用 History API 来处理)为例, 当 url 的 hash 发生变化时,触发 hashchange 注册的回调,回调中去进行不同的操作,进行不同的内容的展示. 直接看代码或许更直观. function Router() { this.routes = {}; this.currentUrl = ''; } Router.prototype.route = function(path, callback) { this.route…
一.搜索引擎工作原理 搜索引擎的工作分为三个阶段,即爬行,索引和检索 1.爬行  搜索引擎具有网络爬虫或蜘蛛来执行爬网,每次抓取工具访问网页时,它都会复制该网页并将其网址添加到索引中. 在“蜘蛛”抓取网页内容,提炼关键词的这个过程中,就存在一个问题:“蜘蛛”能否看懂.如果网站内容是 flash 和 js,那么它是看不懂的.相应的,如果网站内容是它的语言,那么它便能看懂,它的语言即 SEO 2.索引  此阶段,爬网程序会创建搜索引擎的索引.索引就像一本巨大的书,其中包含爬虫找到的每个网页的副本.如…
说起编译原理,印象往往只停留在本科时那些枯燥的课程和晦涩的概念.作为前端开发者,编译原理似乎离我们很远,对它的理解很可能仅仅局限于"抽象语法树(AST)".但这仅仅是个开头而已.编译原理的使用,甚至能让我们利用JS直接写一个能运行JS代码的解释器. 项目地址:https://github.com/jrainlau/c... 在线体验:https://codepen.io/jrainlau/p... 一.为什么要用JS写JS的解释器 接触过小程序开发的同学应该知道,小程序运行的环境禁止n…
转自http://blog.csdn.net/five3/article/details/7686715 web前端性能: 即是web用户在访问一个页面时所要花费的时间总和.即一个完全意义上的用户响应时间,相对于服务器的响应时间而言还会包括更多的内容和影响因素.那么一个web页面的完整请求包括了哪些部分的时间总和就是web前段性能分析和优化所需要了解的基础知识,先了解一下用户从浏览器访问一个url后到页面完全展示所有内容的整个过程吧. 页面的请求过程: 1.浏览器的url请求2.递归寻找DNS服…
一.简略版的 Ajax简介 Ajax(Asyncchronous JavaScript and Xml),翻译过来就是说:异步的javaScript和xml, Ajax不是新的编程语言,而是一种使用现有标准的新方法. Ajax的优点:在不重新加载整个页面的情况下,可以与服务器交换数据,并更新部分网页的艺术. 1. Ajax的工作原理 Ajax的工作原理相当于在用户和服务器之间加了一个中间层(Ajax引擎),使用户操作与服务器响应异步化.并不是所有用户请求都提交服务器.像一些数据验证和数据处理等都…
留待备用! http://www.cnblogs.com/naaoveGIS/category/600559.html 介绍与WebGIS相关的各种原理知识,以及基于原理知识上的程序设计和实现. (一)开篇—杂谈WebGIS (二)探究本质,WebGIS前端地图显示之地图比例尺换算原理 (三)WebGIS前端地图显示之根据地理范围换算出瓦片行列号的原理(核心) (四)WebGIS中通过行列号来换算出多种瓦片的URL 之离线地图 (五)WebGIS中通过行列号来换算出多种瓦片的URL 之在线地图…
从底层谈WebGIS 原理设计与实现(一):开篇 作者:naaoveGI…    文章来源:http://www.cnblogs.com/naaoveGIS/    点击数:4773    更新时间:2014-9-12 摘要:我相信大家对百度地图,谷歌地图等相关应用已经是非常熟悉了.通过这些应用,我们可以浏览地图.定位我们自己的位置.查找我们想知道的兴趣点.搜索交通路线等等.而其实,这些功能便是WebGIS的一些最基本的功能.那么什么是WebGIS呢,说到这里,我还是首先给大家讲讲什么是GIS.…
1.      [置顶](一)开篇—杂谈WebGIS 摘要: 文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/ 1.前言 我相信大家对百度地图,谷歌地图等相关应用已经是非常熟悉了.通过这些应用,我们可以浏览地图.定位我们自己的位置.查找我们想知道的兴趣点.搜索交通路线等等.而其实,这阅读全文 posted @ 2014-08-02 16:32 李晓晖 阅读(15908) 评论(4) 编辑 4.      我有几粒旧子弹…
背景 在上一篇博文中CAD图DWG解析WebGIS可视化技术分析总结提到,实现CAD/DWG图形Web展示的思路一般为解析AutoCAD图形格式,然后转成html5所能绘制的格式如svg,geojson,栅格瓦片,矢量瓦片,在前端渲染.而在WebGIS中地图底图一般采用的是栅格瓦片或 矢量瓦片.下面就相关技术的原理做个分析. 瓦片地图 概念: 瓦片地图金字塔模型是一种多分辨率层次模型,从瓦片金字塔的底层到顶层,分辨率越来越低,但表示的地理范围不变.首先确定地图服务平台所要提供的缩放级别的数量N,…
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.前言 在WebGIS中,影像金字塔是一个很重要的概念.在WebGIS的原理讲解系列中,我讨论过切图的原理,寻址的算法,前端显示的算法等,有兴趣的朋友可以看一下:http://www.cnblogs.com/naaoveGIS/category/600559.html. 我将前端瓦片的来源分为了两种,一种是在线瓦片,一种是离线瓦片.但是如果我们深究瓦片的真正来源,无…
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/ 1.前言 我相信大家对百度地图,谷歌地图等相关应用已经是非常熟悉了.通过这些应用,我们可以浏览地图.定位我们自己的位置.查找我们想知道的兴趣点.搜索交通路线等等.而其实,这些功能便是WebGIS的一些最基本的功能. 那么什么是WebGIS呢,说到这里,我还是首先给大家讲讲什么是GIS. 2.GIS简介 2.1 GIS的名词解释 GIS的全名是Geographic Inf…
声明:本篇在李晓晖的<杂谈WebGIS>,补充更多的资料说明.基于地图二次开发一直断断续续在做,这里算是补充一下基本功把.其实对于前端,WebGis开发都是api,抄demo,改.GIS深入似大海,杂鱼汤来一碗 GIS是什么? GIS(Geographic Information System),它是在计算机硬.软件系统支持下,对整个或部分地球表层(包括大气层)空间中的有关地理分布数据进行采集.储存.管理.运算.分析.显示和描述的技术系统. 因为它可以对空间信息进行分析和处理(简而言之,是对地…
前言 此文我首发于CSDN(所以里面的图片有它的水印) 趁着隔离梳理一下之前做的一个有用的功能:在浏览器中去切割多分辨率瓦片图 这是一个有趣的过程,跟我一起探索吧 阅读本文需具备前置知识:对krpano有所了解,如:使用krpano去开发全景 本着故弄玄虚的原则,最精彩的会放到最后揭晓,由浅入深,层层递进! 1.功能简介 减轻服务器压力,krpano切图比较消耗CPU和内存,我们团队的服务器曾经因为太多人同时切图导致卡顿.宕机 提升切图速度,在js切图速度会比后端快,前端切图与后端切图可以同时使…
路由(前端):原理:只有几个XHR请求,就能实现页面无刷新闪烁更改URL 前端:1. ajax承担数据通信以及相对应的逻辑(交互逻辑) ajax进行数据交互,跟URL打交道,让数据交互的变化反映到URL的变化上,可以让用户保存URL链接,还原之前的内容(包括Ajax局部刷新的变化) Server端:1. 承担大部分业务逻辑2. 处理来自浏览器的请求,根据不同的URL路由,拼接出对应的视图页面,通过Http返回给浏览器进行解析渲染(后端责任艰巨)3. 核心逻辑4. 数据库 通过记录URL来记录we…
续前几篇文章,前面陆续介绍了开源GIS服务器Geoserver,开源数据库Postpresql以及开源前端udig的安装和基本使用. WebGIS前端开发,可以选择arcgis for javascript,arcgis for flex,Openlayers2, Openlayers3,leaflet.Arcgis for javascript 和Arcgis for flex 属于ESRI公司的前端产品,使用这些前端做项目开发,不会收费.本篇既然是讲开源WebGIS解决方案,Web前端开发框…
H5+全栈工程师  (学习下列技术可以加QQ: 1416 7596 61)第一阶段:初级入门阶段基本功 1.HTML入门 Windows概述.浏览器概述.HTML简介.HTML标签详解.前端开发工具概述.特殊字符.SEO.标签语义化 可掌握的核心能力:熟练掌握html/css页面布局排版.样式美化. 工具使用:Hbuilder/Webstrom/Sublime. 掌握常用工具的安装使用,快捷键设置等技巧,快速提高开发调试效率.2.CSS高级程序设计 CSS概述.CSS属性.CSS样式的类型.CS…
本系列主要关注ArcGIS Server以及ArcGIS API for Javascript,由于我本人是从前端方面向GIS方面学习,希望能够给更多需要了解GIS的程序员同学更多的参考.另外本系列会在ArcGIS API for Javascript文档的基础之上,介绍一些GIS方面的知识,仅供参考. ArcGIS介绍 首先我们需要知道ArcGIS指的是Esri公司的一款产品系列,也就是说ArcGIS包含了好几个软件,具体情况可以到Esri中国了解,我们这里要学习的是ArcGIS提供的Web开…
1.2017前端面试题及答案总结 |掘金技术征文 "金三银四,金九银十",用来形容求职最好的几个月.但是随着行业的饱和,初中级前端er就业形势不容乐观. 行业状态不可控,我们能做的当然只是让自己变得更加具有竞争力. 今年自己也用了几个月的时间来准备笔记面试,巩固基础知识.特此将自己在这个过程总结的题目分享出来,希望对于求职和准备求职的同学有所帮助. https://juejin.im/post/59be99a0f265da0644289dde 2.两行 JavaScript 代码 最近…
关于vue-router 由于最近的项目中一直在使用vue,所以前端路由方案也是使用的官方路由vue-router,之前在angularJS项目中也是用过UI-router,感觉大同小异,不过很显然vue-router更友好一些.本文就以vue-router为例浅析我所理解的前端路由,具体用法和一些基本语法就不一一介绍了,官方文档说的更加清晰 关于前端路由 据我所知,在现在这些MVC和MVVM框架兴起之前,是不存在前端路由的,页面之间的跳转是由后台控制的.随着前后端分离和单页面应用(SPA)的兴…
前端基础总结 一:前端实现的原理: 小实例: 01:第一步:创建一个socket服务端: import socket server=socket.socket() ip_port=("127.0.0.1",8009) server.bind(ip_port) server.listen(4) while 1: conn, addr = server.accept() from_client_msg=conn.recv(1024) conn.send(b"http/1.1 20…
前言:公司在前端组和视觉组交接设计稿切图的时候,总会因为视觉组同事们对前端的实现原理不清楚而出现各种问题,在用的时候还得再次返工,前端组同事们一致觉得应该出一份<设计稿切图通用性标准文件>,这里是我结合资料做出的一份总结. 1.切图资源尺寸必须为双数 2.LOGO类图片以方形切图输出    3.可点击部件要把相关状态都切图输出,比如正常状态.点击状态    4.同一类型图片保持同样大小尺寸输出切图 全屏切图类: 局部切图类: 空白页提示案例图:    5.有阴影背景的内容显示区域保持居中输出切…
一.前言 前端路由是什么?如果你之前从事的是后端的工作,或者虽然有接触前端,但是并没有使用到单页面应用的话,这个概念对你来说还是会很陌生的.那么,为什么会在单页面应用中存在这么一个概念,以及,前端路由与我们后端的路由有什么异同呢.本章,我们就来简单介绍下前端路由的概念,以及如何在 Vue 中使用 Vue Router 来实现我们的前端路由. 学习系列目录地址:https://www.cnblogs.com/danvic712/p/9549100.html 仓储地址:https://github.…