FloraCat_染小白-CSDN博客

原创 WebGL原来如此：搞懂三维坐标系变换

三维渲染，顾名思义，就是要将多角度可观测的三维物体绘制到一个固定的二维矩形屏幕上，那么三维到二维是如何映射的呢？就是前面我说的对图形渲染最基础的认知———坐标系转换。一起来搞懂三维渲染需要的MVP变换、视口变换...

2021-12-12 20:12:31 2955

原创基于高德地图的轨迹绘制与轨迹回放

load2DMap() { var tableData = this.tableData; var lineArr = this.lineArr; // 路径数组（二维数组，格式如[ [117.139161, 36.667547], [117.139170, 36.667689]]） va...

2019-10-26 20:11:16 5188 1

原创使用websocket实现浏览器与服务端进行双向通信（Vue springboot）

一、websocket介绍通常服务端想主动给前端推送信息的话，需要使用轮询技术，即在特定的时间间隔（比如每1秒），浏览器通过调用服务端的接口向服务端发送http请求，服务端将最新的数据发送给浏览器。这种方式在性能上有明显的缺点，即浏览器需要不断向服务器发送请求，然而HTTP请求可能包含较长的头部，其中真正有效的数据可能只是很小的一部分，显然会浪费很多的宽带资源。而HTML5的websock...

2019-10-22 21:27:34 2401 1

原创关于前端缓存优化

关于缓存，大概可以分为以下几种：① CDN缓存② DNS缓存③ 客户端缓存（无需请求的memory cache,disk cache；需要发请求验证的Etag/Last-Modified304）④ Service Worker与缓存及离线缓存⑤ PageCache与ajax缓存一、 CDN缓存CDN可以理解为分布在每个县城或乡镇的火车票代售点，用户在浏览网站时，C...

2019-07-04 16:59:08 2413

原创【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 4747

原创【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 12833 4

原创【Vue踩坑之旅】在element的dialog中显示高德地图

一、问题及解决思路高德地图在页面中引用能够正常显示，但是想在弹框中显示高德地图并进行操作，却显示为空白......很奇怪，为什么在页面中能够显示，在对话框里就不能显示了。首先让弹框一开始就显示，并给地图加载增加了3秒延迟，3秒后地图正常显示。喏，看来是组件初始化的时候容器dom还没渲染，因此需要使用nextTick。其次查看element ui的源码，会发现 <div cla...

2019-01-14 16:24:37 10045 9

原创【Vue】Vue项目打包发布到服务器，以及空白页或图片不显示问题

一、Vue项目打包Vue项目完成后，需要打包上线。打包只需要执行命令npm run build即可，但有两点需要注意的地方，否则就会出现空白页或图片不显示问题。① 修改路径位置，解决空白页问题。修改位于项目目录中的config/index.js，将assetsPublicPath: '/'修改为assetsPublicPath: './'，注意有两处。如下： ...

2019-01-09 09:06:41 6424

原创【Vue】以登录token为例，理解vuex状态管理使用

一、Vuex概念 Vue.js通过Vuex对组件的公共状态进行集中管理。每一个 Vuex 应用的核心是 store（仓库），“store”可以理解为是一个容器，包含着应用中大部分的状态 (state)。这些状态是全局的，但Vuex 和单纯的全局对象有以下两点不同： ① Vuex 的状态存储是响应式的。 Vue 组件从 store 中读取状态时，若 store 中的状态发生...

2018-12-21 14:59:48 6374

原创 token实现登录状态保持/身份认证的机制

实现登录状态保持与身份认证的方式通常有两种：session结合数据库、token。两者相比较，token有较多优点。① token可以存储在任何位置（比如cookie或local storage）② token更容易跨域③ token过期时可以通过刷新token，让用户一直保持有效登录④ 如果api在不同终端上，token更方便安全二、token原理其过程大致...

2018-12-19 10:18:32 28244 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 10748 1

原创【javascript】数组去重的五种方法

题目：请给Array本地对象增加一个原型方法，它用于删除数组条目中重复的条目(可能有多个)，返回值是一个包含被删除的重复条目的新数组。参考答案1： Array.prototype.distinct = function() { for(var i = 0; i<this.length; i++){ for(var j ...

2018-12-04 20:44:04 246

原创【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 7169

原创【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 1238

原创【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 530

Given an array of integers, return indices of the two numbers such that they add up to a specific target.You may assume that each input would have exactly one solution, and you may not use the same...

2018-11-24 20:25:21 133

原创安装sass与gulp以及安装过程中遇到的错误

一. 安装过程sass基于Ruby语言开发而成，因此安装sass前需要安装Ruby。（注:mac下自带Ruby无需在安装Ruby!）先从官网下载Ruby并安装。安装过程中请注意勾选中间的Add Ruby executables to your PATH添加到系统环境变量。安装完成后需测试安装有没有成功,运行CMD输入以下命令：C:\Users\DSF>ruby -v...

2018-10-17 21:37:47 416

原创【数据可视化】位置信息坐标转换（GCJ02坐标、WGS84坐标、bd09坐标之间的转换）

现在几乎每一个App都会收集用户位置信息，App得到的坐标大多是通过高德地图等SDK获取的，当使用这些坐标进行webGIS可视化的时候会发现各种偏离状况，坐标不对，叠加错位。这是由于不同SDK获取到的坐标可能属于不同坐标系，想要针对不同地图的地图将手中的坐标数据转换成相吻合的数据，可以采用coordtransform库来解决这一问题。首先，了解现如今互联网坐标系的现状。1. ...

2018-10-15 16:05:21 30848

原创【javascript】使用正则表达式验证

管理系统项目上用到的正则表达式验证：一、验证手机号码最新的手机号验证。function checkMobilePhone(str){ var reg = /^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/; if(!reg.test(str)){ alert("...

2018-09-05 14:31:09 251

原创【React Native第三方库的使用】react-native-scrollable-tab-view实现Tab切换

一、概述react-native-scrollable-tab-view是一款可以实现顶部的Tab切换和底栏切换的第三方库，常用于顶部Tab切换。在HT项目中，我用其实现日周月年运动数据页面的切换，其效果如下图所示：二、使用2.1 准备工作与其他第三方库的用法一样，需要先install再import，然后就可以使用啦。（1）进入项目目录下，执行如下命令行n...

2018-08-04 10:44:49 1823

转载【React Native】生命周期

所谓生命周期，就是一个对象从开始生成到最后消亡所经历的状态，理解生命周期，是合理开发的关键。RN 组件的生命周期整理如下图：如图，可以把组件生命周期大致分为三个阶段：第一阶段：是组件第一次绘制阶段，如图中的上面虚线框内，在这里完成了组件的加载和初始化；第二阶段：是组件在运行和交互阶段，如图中左下角虚线框，这个阶段组件可以处理用户交互，或者接收事件更新界面；第三阶段：是组件卸...

2018-07-31 16:30:12 145

原创【React Native】FlatList——实现带搜索栏的列表

实现效果：实现：搜索框InputBox列表：FlatList代码：import React, { Component } from 'react';import { View, TextInput, FlatList, StyleSheet, StatusBar, Text, Image, TouchableOpacity} from 'react-n...

2018-07-12 14:51:23 3900 1

原创 python读取xml文件

使用xml.dom解析xml一个 DOM 的解析器在解析一个 XML 文档时，一次性读取整个文档，把文档中所有元素保存在内存中的一个树结构里，之后你可以利用DOM 提供的不同的函数来读取或修改文档的内容和结构，也可以把修改过的内容写入xml文件。python中用xml.dom.minidom来解析xml文件，实例如下：def readXml(xml): print("read xml fi...

2018-04-27 18:25:01 2139

原创 CUDA编程理解与案例

一。编写一个简单的cuda程序编写一个cuda c程序，需要以下步骤：（1）用专用扩展名.cu来创建一个源文件（2）使用CUDA nvcc编译器来编译程序（3）从命令行运行可执行文件，这个文件有可在GPU上运行的内核代码下面来看一个最简单的cuda c程序小栗子：#include <stdio.h>__global__ void helloFromGPU(void){ pri...

2018-04-27 09:29:32 2341 1

原创【数据可视化】echarts绘制带有点击事件的图表

2017-12-13 10:46:26 3597

原创【机器学习】神经网络

神经元单层神经网络（感知机）两层神经网络（多层感知机）多层神经网络（深度学习）一。神经元模型1. M-P神经元模型神经元模型是一个包含输入、输出和计算功能的模型。下图的模型中包含3个输入、1个输出，以及2个计算功能。其中的箭头线是连接，带有权重，是神经元中最重要的东西。神经元模型中，有向箭头表示的是值的加权传递。一个神经网络的训练算法就是让权重的值调整到

2017-12-05 19:51:42 831

原创【Python数据挖掘】实用模块之Pandas

Pandas模块是一个强大的数据分析和处理模块，能为复杂情形下的数据提供坚实的基础分析功能。所谓的复杂情形，可能有以下三种：①数据库表或Excel表，包含了多列不同数据类型的数据（如数字、文字）②时间序列类型的数据，包括有序和无序的情形，甚至是频率不固定的情形③任意的矩阵型、二维表、观测统计数据，允许独立的行或列带有标签下面介绍Pandas模块中的基本的高级数据结构，以

2017-12-03 21:39:36 646

原创【CCF】201509_3 模板生成器

试题编号：201509-3试题名称：模板生成系统时间限制：1.0s内存限制：256.0MB问题描述：问题描述　　成成最近在搭建一个网站，其中一些页面的部分内容来自数据库中不同的数据记录，但是页面的基本结构是相同的。例如，对于展示用户信息的页面，当用户为 Tom 时，网页的源代码是

2017-11-30 11:16:48 299

原创【CCF】101412_3集合竞价

试题编号：201412-3试题名称：集合竞价时间限制：1.0s内存限制：256.0MB问题描述：问题描述　　某股票交易所请你编写一个程序，根据开盘前客户提交的订单来确定某特定股票的开盘价和开盘成交量。　　该程序的输入由很多行构成，每一行为一条记录，记录可能有以下几种：　　1. buy

2017-11-29 21:17:48 202

原创【CCF】201403_3命令行选项

试题编号：201403-3试题名称：命令行选项时间限制：1.0s内存限制：256.0MB问题描述：问题描述　　请你写一个命令行分析程序,用以分析给定的命令行里包含哪些选项。每个命令行由若干个字符串组成,它们之间恰好由一个空格分隔。这些字符串中的第一个为该命令行工具的名字,由小写字母组成,你的

2017-11-29 10:49:51 183

原创【数据可视化】数据可视化七大发展趋势

根据云栖社区文章整理，2017年全球深度报道大会针对数据可视化趋势。1. 玩转地图Groeger表示，目前的可视化技术水平已经远远超出了Google Maps，而且每天都会出现很多实验性的技术。 “现在你可以用地图来讲故事。例如，蒂姆·华莱士制作的这张地图就根据每个洲的投票情况来展示美国的领土情况。”

2017-11-28 17:09:35 1245

原创【机器学习】集成学习

一。概括集成学习（ensemble learning），本身不是一个单独的机器学习算法，而是通过构建并结合多个机器学习器来完成学习任务。可以用于分类问题集成、回归问题集成、特征选取集成、异常点检测集成等等，可以说所有的机器学习领域都可以看到集成学习的身影。集成学习思想：对于训练集数据，通过训练若干个个体学习器，再经过一定结合策略，最终形成一个强学习器，以达到博采众长。可

2017-11-28 11:28:38 1122

原创【CCF】Z字扫描与 Z字形打印矩阵

试题编号：201412-2试题名称：Z字形扫描时间限制：2.0s内存限制：256.0MB问题描述：问题描述　　在图像编码的算法中，需要将一个给定的方形矩阵进行Z字形扫描(Zigzag Scan)。给定一个n×n的矩阵，Z字形扫描的过程如下图所示：　　对于下面的4×4的矩阵，　　1

2017-11-27 16:51:25 971

原创【CCF】201604_2俄罗斯方块

试题编号：201604-2试题名称：俄罗斯方块时间限制：1.0s内存限制：256.0MB问题描述：问题描述　　俄罗斯方块是俄罗斯人阿列克谢·帕基特诺夫发明的一款休闲游戏。　　游戏在一个15行10列的方格图上进行，方格图上的每一个格子可能已经放置了方块，或者没有放置方块。每一轮，都会有一个

2017-11-27 15:04:28 186

原创【CCF】201503_2数字排序

试题编号：201503-2试题名称：数字排序时间限制：1.0s内存限制：256.0MB问题描述：问题描述　　给定n个整数，请统计出每个整数出现的次数，按出现次数从多到少的顺序输出。输入格式　　输入的第一行包含一个整数n，表示给定数字的个数。　　第二行包含n个整数，相邻的整数之间用

2017-11-26 21:19:52 230

原创【算法学习笔记】二叉树遍历

一。先序遍历根结点->左子树->右子树[cpp] view plain copyvoid preorder(node* root){ if(root == NULL){ return; //到达空树，递归边界 } printf("%d\n", root->data

2017-11-26 17:27:19 197

原创【算法学习】二叉树

一。递归定义① 要么二叉树没有根结点，是一个空树②要么二叉树由根结点、左子树、右子树组成，且左子树和右子树都是二叉树二叉树的许多算法都需要直接用到这个递归的定义来实现算法。二。存储结构使用链表来定义，定义方式如下：struct node{ typename data; //数据域 node* lchild; //指向左子树根结点的指针 nod

2017-11-25 22:24:52 221

原创【算法学习】DFS与BFS

一。深度优先搜索深度优先搜索会走遍所有的路径，并且每次走到死胡同就代表一条完整路径的形成。概括来说，DFS是一种枚举所有完整路径以遍历所有情况的搜索方法。可以使用栈来实现，也可以使用递归实现。一般情况下非递归要比递归麻烦。不过使用递归的时候系统会调用一个叫系统栈的东西来存放递归中每一层的状态。举个栗子：有n件物品，每件物品的重量为w[i]，价值为c[i]。现在需要选

2017-11-25 10:22:45 373

原创 c++中好用的stringstream

stringstream是c++的模板库的一个类，用于输入输出操作，此外，还有istringstream类用于输入操作，ostringstream类用于输出操作。stringstream可用于作数据切分或类型转换，下面以栗子分别介绍。1. 数据切分#include #include #include using namespace std;int main(){

2017-11-23 11:13:35 337

原创【CCF】201612_3权限查询

试题编号：201612-3试题名称：权限查询时间限制：1.0s内存限制：256.0MB问题描述：问题描述　　授权 (authorization) 是各类业务系统不可缺少的组成部分，系统用户通过授权机制获得系统中各个模块的操作权限。　　本题中的授权机制是这样设计的：每位用户具有若干角色，每

2017-11-23 10:41:22 202

空空如也

空空如也