Ludwig1597

Canvas是 HTML5 新增的，一个可以使用脚本(通常为JavaScript)在其中绘制图像的 HTML 元素。它可以用来制作照片集或者制作简单(也不是那么简单)的动画，甚至可以进行实时视频处理和渲染。 Canvas是由HTML代码配合高度和宽度属性而定义出的可绘制区域。J…

我用echars很久了，如果出现如上图所示样式的饼图，我用echarts很难实现，官方给的文档没有这种模式的饼图。试过用d3和canvas分别画饼图，因为本人对canvas比较熟悉和d3还要引入插件，本着轻量化的原则，所以采用canvas封装。

在该系列的前几篇文章绘制了折线图和柱状图，其实很容易能够总结出，在canvas的绘制过程中，一个重点就是位置坐标的计算。此次我们绘制图形的数据为： 为了方便后续绘制，所以我们要先对数据进行格式化。 懒得想颜色怎么搭配，就随手写了个颜色计算的小函数，颜色的计算依据初始rgb值计算…

其大致思路如上一篇文章一样。需要的步骤主要也是分为 在上一篇的文章基础上，为了更加优雅的代码复用，所以采用对象的方式来管理相关配置和方法。 同上一篇文章一样，为了方便后续的工作，我们需要准备相应的配置项。但此次采用了对象的方式来管理。 坐标轴的绘制和上一篇文章一样，没有什么大的…

大数据可视化不可绕开的图表便是地图。本章节，我们将简单实现一个完整的中国地图以及简单的交互，并封装成React组件。效果图如下： 地图图层的实现其实很简单，由效果图可以看出，地图由多个多变形拼接组成，所以我们只需计算出各个省市边界的相应坐标，几个绘制地图。 这里我们只需将各个省…