以上是效果图，本图表使用d3.js v4制作。图表主要功能是在六边形格子中显示数据，点击底部图标可以切换指定格子高亮显示，图表可以随浏览器任意缩放。 1.图表的主体结构是由正六边形组成，使用d3生成六边形可以使用d3-hexbin.js，生成六边形比较方便，只要给定中心点坐标和半径 ...

D3 提供了 4 个方法用于实现图形的过渡： - transition() 启动过渡效果，其前后是图形变化前后的状态（形状、位置、颜色等等），例如： D3 会自动对两种颜色（红色和蓝色）之间的颜色值（RGB值）进行插值计算，得到过渡用的颜色值。 - duration ...

一款酷炫的前端动态页面 废话不多说 ，分享一款酷炫的页面动态背景 效果见下图。 查看 demo 背景图效果： 实例效果 点击效果： 背景 ...

柱形图是一种最简单的可视化图标，主要有矩形、文字标签、坐标轴组成。 本文为简单起见，只绘制矩形的部分，用以讲解如何使用 D3 在 SVG 画布中绘图。 一、 画布是什么 　　前几章的处理对象都是 HTML 的文字，没有涉及图形的制作。 　　要绘图，首要需要的是一块绘图 ...

由于最近工作不是很忙，隧由把之前的charts项目用d3.js重写的一下，其实d3.js文档很多，但是入门不是很难，可是想真的能做一个完成的，交互良好的图还是要下一番功夫的。今天在echarts找到了一个柱状图，如图。 模仿了一番，废话不多说。下面就开始我们的代码（注意是D3.v4版本 ...

今天我们来仿echarts折线图,这个图在echarts是折线图堆叠，但是我用d3改造成了普通的折线图，只为了大家学习（其实在简单的写一个布局就可以）。废话不多说商行代码。 1 制作 Line 类 2 css 文件 3 HTML 文件 ...

前段时间需要使用免费的图表工具做报表，同事提及了一款图表工具morris。官方网站： http://www.oesmith.co.uk/morris.js/ 该插件遵循BSD协议，可以用于商业软件，也可以进行修改，相对比较宽松。目前插件版本0.4.3，感觉好像 ...

Vue 炫酷 Echarts 图表 网址：https://www.makeapie.com/explore.html#sort=ranktimeframe=allauthor=all 这上边还是有很多设计炫酷的 echarts 图表的，可以做大屏的时候使用。简单的写几个案例，可以根据自己的需要 ...