自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(26)

原创 如何自定义网络拓扑图(d3)

代码已实现,封装中。。。功能如下:展示节点信息,包含节点名称、子节点数量、节点状态、告警数量。 节点之间的关联可以选择是否展示箭头,箭头样式可以自定义。 节点点击事件。点击节点名称,可以查看节点详情;点击节点展开图标,可以展开或者隐藏下游节点;悬浮出现“+”图标,点击可以展示关联内容。 鼠标悬停对象图标上方,本图标和所关联对象之间的线条高亮,并显示两者关系。 鼠标按住对象图标,可对...

2019-10-17 16:19:51 437

原创 使用 es3、es5、es6 实现简单工厂模式、单例模式、观察者模式、发布订阅模式

前言最近公司晋升岗位里面的一道小题《使用 es3 实现简单工厂模式、单例模式、观察者模式、发布订阅模式》,结束之后发现自己还要补好多´д` ;,抽空把里面几道小题,重新复习了一遍,扩充到es3、es5、es6,并做了笔记(再次膜拜公司出题大佬)。完整版github代码地址:https://github.com/xuhuihui/smallDemo/blob/master/demo/demo...

2019-09-30 17:36:19 201

原创 js高级基础面试准备内容

1. 绑定多个 onclick 事件, 输出什么?onclick 属于 dom 的 Level 0 标准普通情况下:输出最后一个 onclick 事件 。// 只弹出 hehebt.onclick = () => { alert('haha')}bt.onclick = () => { alert('hehe')}2. 如何在一个 dom 上绑定多个 ...

2019-07-17 11:25:14 69

原创 HTML语义化

html标签的分类 语义类标签的好处: 增强可读性,页面结构清晰,便于团队的开发和维护 有益于搜索引擎检索(SEO),支持读屏软件,根据文章自动生成目录等。 对于语义标签,用对比不用好,不用比用错好。 语义标签的4种使用场景: 自然语言能力的补充(注解) HTML有些标签是必须的,如果没有,文字会产生歧义。例如某种场景下表示强调的em 文章标...

2019-07-17 11:06:26 74

原创 一图了解网站性能优化

2019-03-29 10:09:36 98

原创 web 安全问题及解决方案

1. SQL注入直接在SQL里执行了用户输入。解决方案:输入验证,检查用户输入的合法性。 错误消息处理,防范SQL注入,还要避免出现一些详细的错误消息。 加密处理。2. XSS漏洞(跨站脚本攻击)定义:在HTML里代码执行了用户输入。例子:恶意攻击者往Web页面里注入恶意Script代码,用户浏览这些网页时,就会执行其中的恶意代码,可对用户进行盗取cookie信息、会话劫持等各...

2019-03-27 13:21:31 203

原创 react数据管理

方法 依靠状态提升来和兄弟元素进行数据交互 应用场景:组件层级扁平,兄弟组件通信情况很少 通过发布订阅模式做数据交互:通过观察者模式 应用场景:业务规模较小,层级较深的业务 redux等数据管理工具:redux单向数据流 应用场景:业务复杂,组件层级较深,兄弟组件通信密切 ...

2019-03-27 13:17:30 179

原创 react的生命周期

生命周期简介class App extends React.Component { //构造函数 constructor(props) { super(props) this.state = { data: 'old' } console.log('constructor') } //组件将要加载 componentWi...

2019-03-27 13:09:23 83

原创 如何优化动画???

动画基础知识1. 动画帧率(FPS)计算帧的定义:1幅画就叫做“1帧”,每秒帧数指的就是“每秒播放的画面数”。每一帧都是静止的图象,快速连续地显示帧便形成了运动的假象。高的帧率可以得到更流畅、更逼真的动画。每秒钟帧数 (fps) 愈多,所显示的动作就会愈流畅。理论上说,FPS 越高,动画会越流畅,目前大多数设备的屏幕刷新率为 60 次/秒,所以通常来讲 FPS 为 60 frame/s...

2019-03-12 14:36:17 167

原创 js基础面试准备内容

js基础知识题目 JS中使用typeof能得到的哪些类型?(考点:变量类型) object,string,number,boolean,function,undefined 何时使用"===",何时使用"==",为什么要使用"==="?(考点:强制类型转换) (1) Object.is的用法跟"==="的用法一样 if (obj.a == null) { // 判断对...

2018-11-01 19:45:57 1789

原创 svg、canvas、css3d实现数据可视化(伪3d)

前言:这次项目用到了一些自定义的数据可视化组件,我把我做的部分抽出来几个典型做个汇总。分为如下:星球环绕旋转图 -- 方法一: svg:animateMotion+ animateTransform 方法二:css3d 地图 -- svg渲染 + div悬浮框 + js事件 二维饼图(风车图) -- canvas: dragCircle 、 stopDragging 三棱锥 -...

2018-08-07 14:32:00 5093

原创 canvas简单封装一个echarts实现不了的饼图

效果展示:我用echars很久了,如果出现如上图所示样式的饼图,我用echarts很难实现,官方给的文档没有这种模式的饼图。试过用d3和canvas分别画饼图,因为本人对canvas比较熟悉和d3还要引入插件,本着轻量化的原则,所以采用canvas封装。官方饼图两种模式:(1)半径模式(2)面积模式实现过程封装的函数如下: function drawCircle(canvasId, optio...

2018-06-11 16:14:13 747

原创 vue中将网页以pdf格式下载

1、下载 html2canvas和jspdf  两个插件yarn add html2canvas jspdf2、html2canvas 和 jspdf github地址https://github.com/niklasvh/html2canvashttps://github.com/MrRio/jsPDFhtml2canvas官方示例:http://html2canvas.hertzen.co...

2018-06-05 15:07:36 1551 1

原创 使用svg(1)-画一张星空背景图

github网址:https://github.com/xuhuihui/svg<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, i

2018-06-05 15:00:04 1113

原创 parcel学习过程(一)--项目启动

中文手册:http://www.itbaby.me/doc/parcel/学习代码:https://github.com/xuhuihui/parcel1.首先使用 Yarn 或 npm 安装 Parcel :Yarn:yarn global add parcel-bundlernpm:npm install -g parcel-bundler2.使用以下命令在你的项目目录中创建一个 packag...

2018-06-05 14:58:00 521

原创 使用VuePress搭建一个类型element ui文档

网站成果样式项目书写步骤 github地址:https://github.com/xuhuihui/dataCom官网:http://caibaojian.com/vuepress/guide/getting-started.html参考文章:https://www.javascriptcn.com/read-31206.html前言:我先git clone官方gith...

2018-06-04 15:19:10 13236 2

原创 git 多账号 ssh-key 管理(github和gitlab共同使用)

日常使用 git 作为仓库使用时,会遇到以下情况:有两个 github 账号(至少两个),一台电脑同时连接这两个账号进行维护私人 github 账号,公司 gitlab 账号1 清除 git 的全局设置(针对已安装 git)新安装 git 跳过。若之前对 git 设置过全局的 user.name 和 user.email。类似(用git config --global --list 进行查看你是否...

2018-05-07 17:51:20 2416 2

原创 使用dagre-d3做一个dag图(关系图)

dagre-d3插件github地址:https://github.com/dagrejs/dagre-d3csdn引入:<script src="https://d3js.org/d3.v4.min.js" charset="utf-8"></script><script src="../dist/dagre-d3.js"></script&amp

2018-04-10 11:33:56 28999 26

原创 mockjs新手教程

安装:cnpm install mockjs例子:1.新建文件mock.js,里面的代码如图所示。require引入mockjs,produceNewsData就是一个简单的参数,真正执行的核心函数就一句话Mock.mock('/news/api','post',produceNewsData)2.在app.js里面引用3.role里面调用接口4.console显示结果,接口已经通了。本人总结(个...

2018-03-06 17:05:05 2448 3

原创 常用函数

输出0~n之间的随机整数parseInt(Math.random() * n)过滤中英文()里面的内容,包含括号()function toScene(param) { if (param === null) { return '--' } let scene = param.replace(/\(.*?\)/g, '') scene = scene.replace(/\(...

2018-03-06 16:58:03 54

原创 vue中的父子组件调用

1.把子组件的数据传给父组件App.vue 父组件  Hello.vue 子组件  $emitimport hello from './components/Hello'export default {  name: 'app',  'components': {    hello  },  methods: { 

2017-08-14 11:45:03 148

原创 在线小说阅读器app

github地址: https://github.com/xuhuihui/storyRead.git悦书-系统说明文档APP名称:悦书--------一个在线小说浏览器工作量(代码行数/源代码文件数量):代码行数:java类有1264行代码,rawable文件下的xml有747行代码,drawable文件下的xml有385行代码,共计2396行代码。 源代

2017-07-27 16:20:56 674

转载 git操作和npm操作

把项目clone到本地是没有依赖的,需要执行1. yarn install (安装所有依赖)2. npm run dll (生成dll文件,dll文件是把常用的依赖打包,防止webpack重复编译的,主要是为了提升本地server的效率)3. npm run dev (启动本地node server,浏览器通过localhost:2046访问)4. npm run build (日

2017-07-27 11:44:26 1147

转载 vue的扩展

UI组件element ★9305 - 饿了么出品的Vue2的web UI工具套件Vux ★6802 - 基于Vue和WeUI的组件库mint-ui ★4776 - Vue 2的移动UI元素iview ★4458 - 基于 Vuejs 的开源 UI 组件库Keen-UI ★2363 - 轻量级的基本UI组件合集vue-material ★2207 - 通过Vue M

2017-07-17 16:08:02 679

原创 vue中的懒加载和按需加载

异步加载组件

2017-07-17 15:48:34 18346

转载 jsp 快捷键(eclipse)

在当前位置,加注释   CTRL+SHIFT+C关于ECLIPSE的快捷键,详细菜单说明   CTRL+SHIFT+L注释选中内容   CTRL+SHIFT+/

2017-03-16 10:34:42 3910

空空如也

空空如也

空空如也
提示
确定要删除当前文章?
取消 删除