关注
分享
FloraCat_染小白
前端空城狮爱GIS可视化
展开
-
基于高德地图的轨迹绘制与轨迹回放
load2DMap() { var tableData = this.tableData; var lineArr = this.lineArr; // 路径数组（二维数组，格式如[ [117.139161, 36.667547], [117.139170, 36.667689]]） va...原创 2019-10-26 20:11:16 · 5241 阅读 · 1 评论 -
使用websocket实现浏览器与服务端进行双向通信（Vue springboot）
一、websocket介绍通常服务端想主动给前端推送信息的话，需要使用轮询技术，即在特定的时间间隔（比如每1秒），浏览器通过调用服务端的接口向服务端发送http请求，服务端将最新的数据发送给浏览器。这种方式在性能上有明显的缺点，即浏览器需要不断向服务器发送请求，然而HTTP请求可能包含较长的头部，其中真正有效的数据可能只是很小的一部分，显然会浪费很多的宽带资源。而HTML5的websock...原创 2019-10-22 21:27:34 · 2440 阅读 · 1 评论 -
关于前端缓存优化
关于缓存，大概可以分为以下几种：① CDN缓存② DNS缓存③ 客户端缓存（无需请求的memory cache,disk cache；需要发请求验证的Etag/Last-Modified304）④ Service Worker与缓存及离线缓存⑤ PageCache与ajax缓存一、 CDN缓存CDN可以理解为分布在每个县城或乡镇的火车票代售点，用户在浏览网站时，C...原创 2019-07-04 16:59:08 · 2427 阅读 · 0 评论 -
【vue】vue使用x2js解析xml文件
一、功能需求实验室的项目需要添加直播功能，获取到直播流网址如下图所示：这是一个xml网址，需要解析这个xml网址获取到正在直播的rtmp地址，以进行直播展示。jq使用get或ajax解析xml文件在vue框架里似乎行不通了。搜索发现了x2js插件，用于在XML和JavaScript对象之间进行转换的库。二、x2js安装配置可以使用npm安装或者到https://github...原创 2019-02-20 10:57:18 · 12956 阅读 · 4 评论 -
【vue】video结合cyberplayer.js实现flv视频播放
一、原理H5新增的<video>标签可以用于视频播放，但格式有限，播放不了直播生成的.flv视频。那么可以结合cyberplayer.js来实现.flv视频播放，简单粗暴。原理如下：① 下载该库，并在index.html中引入<script type='text/javascript' src="./static/js/cyberplayer-3.4.1/cyb...原创 2019-02-22 15:12:44 · 4786 阅读 · 0 评论 -
【Vue】如何使用脚本架工具vue-cli快速创建vue项目
对于初学小白，webpack迷迷糊糊，写vue已经够辛苦的了，奈何还要自己配置webpack......其实有帮助我们更好更快速开发代码的工具——vue-cli一、安装常用的有cli2和cli3两个版本，至此，cli2非常成熟，cli3相对成熟而更加强大。cli2：npm install -g vue-clicli3：npm install -g @vue/cli...原创 2018-11-29 15:59:44 · 544 阅读 · 0 评论 -
【leetcode】Reverse Integer（整数、字符串和数组之间转换）
Given a 32-bit signed integer, reverse digits of an integer.Example 1:Input: 123Output: 321Example 2:Input: -123Output: -321Example 3:Input: 120Output: 21Note:Assume we are de...原创 2018-12-02 21:49:57 · 1249 阅读 · 0 评论 -
【数据可视化】位置信息坐标转换（GCJ02坐标、WGS84坐标、bd09坐标之间的转换）
现在几乎每一个App都会收集用户位置信息，App得到的坐标大多是通过高德地图等SDK获取的，当使用这些坐标进行webGIS可视化的时候会发现各种偏离状况，坐标不对，叠加错位。这是由于不同SDK获取到的坐标可能属于不同坐标系，想要针对不同地图的地图将手中的坐标数据转换成相吻合的数据，可以采用coordtransform库来解决这一问题。首先，了解现如今互联网坐标系的现状。1. ...原创 2018-10-15 16:05:21 · 31042 阅读 · 0 评论 -
【JavaScript】JS处理32位整型位运算
由上一篇leetcode题目（反转整数）中所涉及到的js整型范围，针对js如何处理32位整数运算原理以作扩展：1、32位整数运算首先要清楚，在JS中无论是整数还是小数都是按照64位的浮点数形式存储，而整数运算会自动转化为32位有符号整数。有符号整数使用 31 位表示整数的数值，用第 32 位表示整数的符号，0 表示正数，1 表示负数。数值范围为 [-2^31 , 2^31-1]， 即[...原创 2018-12-03 09:32:20 · 7244 阅读 · 0 评论 -
【Vue】以登录token为例，理解vuex状态管理使用
一、Vuex概念 Vue.js通过Vuex对组件的公共状态进行集中管理。每一个 Vuex 应用的核心是 store（仓库），“store”可以理解为是一个容器，包含着应用中大部分的状态 (state)。这些状态是全局的，但Vuex 和单纯的全局对象有以下两点不同： ① Vuex 的状态存储是响应式的。 Vue 组件从 store 中读取状态时，若 store 中的状态发生...原创 2018-12-21 14:59:48 · 6400 阅读 · 0 评论 -
token实现登录状态保持/身份认证的机制
实现登录状态保持与身份认证的方式通常有两种：session结合数据库、token。两者相比较，token有较多优点。① token可以存储在任何位置（比如cookie或local storage）② token更容易跨域③ token过期时可以通过刷新token，让用户一直保持有效登录④ 如果api在不同终端上，token更方便安全 二、token原理其过程大致...原创 2018-12-19 10:18:32 · 28366 阅读 · 3 评论 -
【采坑之路】 axios 的跨域问题
最近学了一下vue，尝试做一个管理网站，使用axios请求后台接口数据时，又难免掉进了跨域坑中，报错如下403：根据报错提示“XMLHttpRequest has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.”，可以得知...原创 2018-12-12 09:35:15 · 10865 阅读 · 1 评论 -
【Vue踩坑之旅】在element的dialog中显示高德地图
一、问题及解决思路高德地图在页面中引用能够正常显示，但是想在弹框中显示高德地图并进行操作，却显示为空白......很奇怪，为什么在页面中能够显示，在对话框里就不能显示了。首先让弹框一开始就显示，并给地图加载增加了3秒延迟，3秒后地图正常显示。喏，看来是组件初始化的时候容器dom还没渲染，因此需要使用nextTick。其次查看element ui的源码，会发现 <div cla...原创 2019-01-14 16:24:37 · 10286 阅读 · 9 评论 -
【Vue】Vue项目打包发布到服务器，以及空白页或图片不显示问题
一、Vue项目打包Vue项目完成后，需要打包上线。打包只需要执行命令npm run build即可，但有两点需要注意的地方，否则就会出现空白页或图片不显示问题。① 修改路径位置，解决空白页问题。 修改位于项目目录中的config/index.js，将assetsPublicPath: '/'修改为assetsPublicPath: './'，注意有两处。如下： ...原创 2019-01-09 09:06:41 · 6516 阅读 · 0 评论