Mr.Yellow.Wills

写一个字demo 地址demo地址 根据速度设置线条粗细代码1234567891011121314151617181920212223242526var lastLineWidth = -1;var maxLineWidth = 30;var minLineWidth = 1;var maxStrokeV = 10;var minStrokeV = 0.1;function calcLine... more

基础知识html5、canvas、svg、WebGL历史介绍html5的草案大概是2008年开始制定，用来取代1999制定的html 4.1，经历了html5草案制定，到2014年最终标准发布。canvas 由苹果公司在 2004 年前后发明运用于Safari，后来其他的浏览器开始跟进，后来canvas被收入到html5草案中，之后大家对canvas关注越来越多(canvas被大家越来越多的... more

最近对从业以来的css知识从新梳理，整理成四篇博客，除本篇博客外，还有：《vertical-align、行盒子、baseline》《css之移动开发》《css之布局》 css需求方案三角12345678<div class="triangle"></div>.triangle{ height: 0; width: 0; border... more

本篇的css知识点，都在《css笔记》中有列举，由于知识点篇幅较大，单独将知识点放置于本篇详细描述。 float浮动定位浮动定位有以下特点： 收缩为最小宽度除非已经定义了浮动元素的宽度，否则浮动元素收缩为适应元素内容的最小宽度。 遇到块级元素将停止对于自身而言，浮动元素脱离文档流后，遇到块级元素将停止， 脱离文档流，但不脱离文本流当一个元素变为浮动元素时，对不同类型的相邻元素影响如下： 与行... more

我们都知道，定位、浮动、flexbox，这些可以用来布局；我们也知道什么固定布局，流式布局等等，这些也是布局；那么定位、浮动这些是什么布局呢，是固定布局吗?都不是，所以固定布局、弹性布局、流式布局，这些更代表了一种布局的设计思想，一种布局方案，而定位、浮动、flexbox这些是一种布局的技术手段。我们大可这样理解：布局的设计方式有 固定设计方式、弹性设计方式、流式设计方式、响应式设计方式;布... more

分辨率与像素这是三星 GALAXY S5 手机 pixels单词含义1pixels //此单词含义为：像素 所以px，指得就是像素。 物理像素 与 分辨率物理像素上图中1920X1080像素，其实就是1920pxX1080px；如下图：没错，这个像素就是(设备)物理像素(physical pixels)，它的单位也是px。(注意，这个px 非 css中使用的px，后面有讲解)。上图表面，这个... more

本文讲解vertical-align, baseline, 行盒子, x-height, line-height, 半铅空,以及这些概念如何运用于行内元素居中、和使用line-height让元素居中，其中花了大量示例和说明介绍了如何确定父元素和行内元素的baseline。 vertical-align为什么会这样描述如图两个定义为inline-block的div一模一样，就是一个多了555：... more

d3知识d3文档介绍d3各版本变化官网英文 d3小知识点或技巧gx.call(xAxis)与xAxis(gx)相等123456//生成底部轴线const xAxis = d3.axisBottom(xScale);//设置轴线偏移位置const gx = svg.append('g').attr('transform', `translate($
... more

这里讲解d3的 enter update exit三种模式，以及 append、data、selectAll。 基本代码下面代码都基于以下代码：1234var svg = d3.select("body") .append('svg') .attr('width', 800... more

d3图形图解 树图树图布局APId3.layout.tree() 创建一个树图布局tree.size([]) 设置相邻节点间隔tree.separation([separation]) 设置相邻节点间隔tree.nodes(root) 根据root 计算获取节点数组tree.links(nodes) 根据nodes 计算获取连线数组节点对象(nodes)parent 父节点children ... more