王海虎-CSDN博客

原创大数据前端可视化大屏--前端开发之路

可视化常用组件有哪些？常用的技术栈是什么？可视化的常见问题有哪些如何解决？一、什么是可视化大数据可视化这词相信大家并不陌生，从 17 世纪的地图和图形到 19 世纪初饼图的发明，使用图表来理解数据的概念已经存在了数个世纪。可视化一直伴随着我们的生活，在我们的生活中更是无处不在，像天猫双十一、女神节都各种各样的指标数据进行采集，像我们生活中的气象、交通、运维...都需要可视化。随着数字化时....

2022-05-09 20:50:53 17649 11

文件????heatmap.min.js地址 https://www.patrick-wied.at/static/heatmapjs/创建var heatmap1 = h337.create({ container: domElement, //容器 backgroundColor, // 背景颜色 gradient: {//渐变颜色 "0": "#469b2c",//value为0的颜色 "0.025": "#096dca",//valu

2020-12-11 18:01:58 3219 3

原创 threejs开发3d地球酷炫效果

代码如下，详情：https://gitee.com/XiaoHu12685/three-demo/blob/master/examples/earth_tiger.html<!DOCTYPE html><html lang="en"><head>  <meta charset="utf-8"> ..

2020-08-10 00:17:30 9779 5

原创 videojs，报错：No compatible source was found for this media.

1. 需要起一个web服务，nginx、Apache...2. 打开Flash

2020-07-21 22:46:13 5196

原创 web浏览器通过videojs对接实时视频流rtsp、rtmp格式

注意：rtsp没法直接用，需要做格式转换，转成flv，或者rtmp<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>VideoDome</title>

2020-07-21 22:35:19 13038 3

原创 js、react使用html2canvas页面截图并导出

import React, { Component } from 'react';import { render } from 'react-dom';import html2canvas from 'html2canvas';import Hello from './Hello';import './style.css';class App extends Component { constructor() { super(); this.state .

2020-07-16 17:42:10 3629

原创 3d离线地图，如何实现？

3d离线地图，如何实现？离线地图说白了就是把地图上加载的在线服务转成本地发布的地图服务，地图服务有很多种，地图数据也有很多种，例如tif，shp等等离线服务 wms服务、wmts服务、xyz服务地图完整的3d地图分为两块第一块是地图（就是底层，不包含建筑），区分两种第一种：矢量瓦片（普通地图）文件格式 1. PNG、GIF、JPEG等栅格形式; ...

2020-07-14 17:18:35 1206 1

原创 Nginx配置ReactRouter browserHistory browserRouter

重定向根目录server { ... location / { try_files $uri $uri/ /index.html }}重定向到指定目录server { ... location / { root /usr/local/nginx/html/name; //name 就是你要指定的路径 try_files $uri /index.html; }}...

2020-07-01 11:32:21 902

原创 babel7.0 兼容ie浏览器

替代 @babel/polyfill// 入口文件出引入import "core-js/stable";import "regenerator-runtime/runtime";// .babelrc 下添加[ "@babel/env", { "corejs": "3", "useBuiltIns": "entry", "targets": { "chrome": "58", "i

2020-06-28 12:36:31 1601

原创 react babel如何升级7.1.0

react babel升级7.1.0让我们了解一下babel升级到7.1.0，都做了那些改变1、移除了以下的组合，这些预设应替换为env预设。babel-preset-es2015babel-preset-es2016babel-preset-es2017babel-preset-latest2、删除 @babel/polyfill@babel/polyfill3、弃用了 stage-x@babel/preset-stage-0@babel/preset-stage-1@ba

2020-06-28 12:33:04 871

原创 js 如何判断字符串是否是正则表达式？

eval(text) instanceof RegExp // 返回布尔

2020-03-30 16:52:48 7581

原创 js 获取如何鼠标滑词？

window.getSelection().toString()详情：https://developer.mozilla.org/zh-CN/docs/Web/API/Window/getSelection<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8">...

2020-02-24 21:31:53 464

原创 js 导出.json文件

// 自动触发点击事件AutomaticClick = (obj) => { var ev = document.createEvent("MouseEvents"); ev.initMouseEvent("click", true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null); ...

2020-02-19 16:01:55 2858 1

原创 echarts世界地图东西半球调换位置？

前段时间遇到一个需求，需要吧世界地图东西半球位置调换一下，这段时间发现很多人也遇到了相同的问题。其实只需要换下一地图文件就好。链接: https://pan.baidu.com/s/1R5_msnM8HtJOQi6A39yQ8Q 提取码: hkx5需要注意的是，如果换了地图的位置，坐标可能不太精准，这个坐标我处理过，大家可以试试。链接: https://pan.baidu.com/s/1...

2019-12-10 14:13:56 1351 1

原创 fetch、axios 在Android上请求失败，报错信息：Network request failed、Network error

查阅了很多文档后，发现在android9.0以上由于安全性高了，所有不做处理http不能使用，解决方法有如下三种：详情请看这篇文章：https://blog.csdn.net/xiaohu12685/article/details/103219192...

2019-11-23 21:58:04 7933

原创 Android端请求失败，错误信息network error

发现在模拟器上请求没问题，但是打包之后，请求失败，提示错误信息network erroraxios请求fetch请求查阅了很多文档后，发现在android9.0以上由于安全性高了，所有不做处理http不能使用，解决方法有如下三种：1. 降级targetSdkVersion的版本，降到27或27以下2.服务器请求http改为https (推荐...

2019-11-23 21:51:45 17852 3

原创 Unknown argument type 'attribute' in method -[RCTUIManager setJSResponder:blockNativeResponder:]

我用xcode启动项目后，一直报Unknown argument type '__attribute__' in method -[RCTUIManager setJSResponder:blockNativeResponder:]的问题，之前Xcode10的时候没事，更新到Xcode11就开始报这个错了解决方案：路径：项目/node_modules/react-native/React/...

2019-11-14 15:27:13 3725 1

原创 react-natve Android手机安装完成之后打不开，闪退！

在项目根目录下执行react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res执行成功之后会在/a...

2019-08-21 16:01:16 854

原创 > Cannot add task 'wrapper' as a task with that name already exists.

> Cannot add task 'wrapper' as a task with that name already exists. 说是在android/build.gradle 文件36行报错最终发现原因是gradle版本问题// 旧版本是:task wrapper(type:Wrapper) { //configuration}// 新版本是：wra...

2019-08-21 15:59:11 9105

原创 react-natve Android打包，到手机安装全过程。 react-natve Android打包失败、react-natve Android手机安装完成之后打不开，闪退！

打包共5个步骤1.在终端里面,cd 到项目的根目录后.执行下面这行命令:keytool -genkey -v -keystore my-release-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 100002.执行第一步会在根目录下会生成一个XXXXXX.keystore的文件,直接拿到...

2019-08-21 15:56:35 368

原创 bash: ls: 未找到命令

刚刚修改完PATH之后，发现ls不能用了、ll、vi、vim都不能用了。原因是：环境变量PATH被修改了，是刚刚的修改影响了PATH解决方法export PATH=/bin:/usr/bin:$PATH...

2019-08-16 10:19:02 6711 2

原创 echarts地图文件json，全国各个省份省市县三级echarts绘制地图所需的json数据。广东、北京、上海、深圳、福建、安徽.....

前段时间给大家分享了一个chine.js地图文件，发现还是帮助的不少人，今天我想用广东省画一个地图组件的时候，发现没有广东省的地图文件json，网上一搜发现都是需要付币的。今天整理了一下，把全国所有省份地图组件分享出去，希望能对大家有帮助。百度网盘地址: https://pan.baidu.com/s/1an3Fsp_RdiGMTfP2N83bzA 提取码: dhsm...

2019-04-08 17:55:08 8559 6

原创 D3.js基础语法，精通D3.js，D3.js小书，第二篇

第二章我们上篇文章讲到了数据绑定datum()、data()，相信都已经会用了，但是如果 "数组长度 ≠ 元素数量"不一致，就会带来3个选择集：update、enter、exit//...

2019-01-29 17:24:10 908 2

原创 D3.js基础语法，精通D3.js，D3.js小书，第一篇

从今天起我给大家分享一下D3.js ，D3是一个JavaScript的函数库，D3 的全称是 Data-Driven Documents，我这边不做多介绍，本次分享只想着给大家分享一点干货。有些同学应该听过Echarts、Highcharts、Chart.js等等，要知道这些都是基于D3封装的，熟悉D3的人能做出一个属于自己的Highcharts或者E...

2019-01-29 15:02:46 1780 1

原创 js 随机生成id

processID = () => { const uuid = 'xxxxxxxx-xxxx-xxxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) { const r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8); retu...

2019-01-27 10:02:30 1094

原创 js 倒计时多少天、时间戳差转化为时间，计算出运行多长时间，从开始值减去当前时间，计算出运行的时间差

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &am

2019-01-04 14:13:35 1649

原创 highcharts 3D饼图实现凸出效果

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">

2018-12-18 18:35:45 9252 6

原创可视化常用效果，js+css 实现人物百分比、象形图

js+css实现象形图，人物百分比<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.

2018-12-18 18:25:34 4602

原创 css 实现3D立方体效果

前两天需要用到一个3D立方体的效果，知道c3可以写但一直都没试过，然后自己写了一下效果还不错，想着跟大家分享一下<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content=&qu

2018-12-18 18:20:23 385

原创 mac上添加虚拟域名

1.第一步找到你的apache, extra/httpd-vhosts.conf(虚拟主机配置文件)；添加如下配置：<VirtualHost *:80> DocumentRoot "/Library/WebServer/Documents/xxx" //项目路径 ServerName www.xxx.com // 自定义虚拟域名</Virtua...

2018-12-18 18:10:43 1392

原创 react-router HashRouter和BrowserHistory的区别, 以及配置、使用, Link跳转传参等等

I. 区别我们平时在使用React项目，通常都会用到react-router,今天我们讲讲常用到的react-router HashRouter和BrowserHistory的具体，相信大家都对它们有一定的了解了，在这里还是简单说一下吧，没有好与坏只有适不适合HashRouter 会有一个#，通过这个# HTML 5 History进行前端跳转他的感觉像锚点 BrowserHistory...

2018-11-12 16:54:13 6902

原创 JS 数组按指定长度切割，返回一个新的数组集合，比如按照3的倍数切割，返回结果为每三个一组

let data = [ {name:'小赵',value:'12'}, {name:'小钱',value:'12'}, {name:'小孙',value:'12'}, {name:'小李',value:'12'}, {name:'小周',value:'12'}, {name:'小吴',value:'12'}, {name:'小郑',val...

2018-10-29 13:52:04 9442

原创 react 脚手架里如何使用less？

安装完react脚手架以后，是不支持less的，但是我们可以自己配置，react脚手架没有暴露webpack.config.js，那他就没有吗开玩笑，那他怎么配置，首先我们：第一步：找到node_modules/react-scripts/config/webpack.config.dev、webpack.config.prod这个react-scripts就是配置文件啦，看到...

2018-10-25 12:01:25 4642 4

原创快速创建react路由，了解一些react路由配置

你来百度搜索这个问题就说明你就没好好的看人家提供的README.md文件这上面说的很清楚，如何安装、如何使用，删除src/App.js,打开这个链接复制贴贴就OK了，我们来掩饰一遍1.执行 npm install --save react-router-dom 或者 yarn add react-router-dom 根据自己的实际情况选择2.然后找到src/App.js 删...

2018-10-20 18:02:10 557

原创 3分钟熟练使用querySelector、querySelectorAll，了解queryCommandState、Supported...，每一个的使用方法

今天给大家分享一下querySelector这个的使用方法，前段时间有人问我querySelector语法如何使用，想着有时间分享一下，结果前段时间有点忙一直没腾出时间来，正好今天有时间了 go go go，这样的语法出现已经有很长一段时间了(真的很长时间了)，可能是自己不太关注罢了，但不得不说，挺好用的，今天给大家分享一下。据说是HTML5向Web API新引入了document.query...

2018-09-26 15:33:12 6567

原创 apr-1.5.1.tar.gz-CSDN免费下载

apr-1.5.1.tar.gz下载链接: https://pan.baidu.com/s/1OdvU9bRijUXYcuJHp6pCPA 提取码: by26 今天在装Apache的时候需要一个下载一个文件就是apr-1.5.1.tar.gz这个文件，百度一搜都是需要c币的30多个，想我这样的穷屌丝怎么会有呢，就找朋友要了一个，觉得分享给大家，万一你们也用得到呢。...

2018-09-21 09:51:59 2209

转载 http响应状态码

当我们从客户端向服务器发送请求时服务器向我们返回状态码状态码就是告诉我们服务器响应的状态通过它，我们就可以知道当前请求是成功了还是出现了什么问题状态码是由3位数字和原因短语组成的（比如最常见的：200 OK）其中第一位数字表示响应类别，响应类别从1到5分为五种 add：其实我查阅资料发现还有一个6打头的一个 600 Unparseable Response Headers ...

2018-09-05 11:45:45 713

原创 vue theme-default保存找不到Module not found: Error: Can't resolve 'element-ui/lib/theme-default/index.css

当时很懵逼，看了半天还以为自己安装丢包了呢，给大家分享一下，1秒钟就解决了：着急的同学直接：import 'element-ui/lib/theme-default/index.css'改为import 'element-ui/lib/theme-chalk/index.css'想知道原因的同学往下看让后我就去官网上找答案发现，官网上写的很清楚，...

2018-08-21 16:51:16 24950 6

原创 webpack安装、cnpm安装、vue安装、vue-cli安装、element安装全过程，给大家分享一下

从webpack 到 vue ui框架安装全过程 , 方法如下1.检查是否安装node、npm , 我们可以先版本信息,查看是否安装node -v || npm -v //显示版本好的号的话版本号说明白已经安装了, 如果想要安装cnpm,可以去淘宝镜像http://npm.taobao.org/$ npm install -g cnpm --registry=https...

2018-08-21 16:29:19 2097

原创 vis Network demo,源码开源 + （vue框架）

前段时间用到了，感觉不错，写了一个开源的demo，大家有兴趣的可以看看https://github.com/xiaohu12685/Network_demo_vis。大体样子就是这样，看功能就好，界面请忽略；就是这个vis，官网链接http://visjs.org/ ，本文提到的就是这个网络神经这一块前端框架用的就是vue（vue没有用到任何技术含量）；这个demo...

2018-08-20 17:58:45 4089 1