王者荣耀雷达图的基本构成。 聊天记录当中的雷达图不是特别清楚，所以我这边截图了自己的一个战绩雷达图。 好了扯远了，让我们回到正题上来。 通过截图上面的雷达图基本主体是一个正六边形，每个顶点则配有相应的文字说明。 然后就是中间红色区域部分则由对角线上的点，连成一圈填充构成。因此这…

最近做的一个需求，场景之一是绘制一个雷达图，找了一圈，似乎 AntV 下的 F2 很适合拿来主义： 但是接着又考虑了一下，我当前所做的项目并不是可视化项目，今后大概率也不会有这种可视化图表的需求，只是

六边形能力图如下，由 6 个 六边形组成，每一个顶点代表其在某一方面的能力。这篇文章我们就来看看如何基于 canvas 去绘制这么一个六边形能力图。当然，你也可以基于其他开源的 js 方案来实现，如 EChars.js 等。 六边形能力图有 6 个 六边形组成，那我们只要绘制出…

面对网页性能要求越来越高的今天，项目性能优化已经成了项目开发中必不可少的一个环节。尤其是现在越来越火🔥的在线教育、在线编辑、直播、游戏等类型的项目中Canvas和WebGL的运用越来越多。

面对网页性能要求越来越高的今天，项目性能优化已经成了项目开发中必不可少的一个环节。尤其是现在越来越火🔥的在线教育、在线编辑、直播、游戏等类型的项目中Canvas和WebGL的运用越来越多。

源码在GitHub上，总结下使用fabric.js开发一个编辑器需要用到哪些知识点。 预览地址：https://nihaojob.github.io/vue

纯 js 实现基于 canvas 的文本划词高亮，与文本展示内容的结构完全解耦，不改变文本内容原本的 DOM 结构。

注：下面实现项目效果主要是关于JavaScript方面的，下面仅仅是提供实现思路的代码，并非全部代码。 css代码可以根据个人习惯进行美化界面，所以这里就不写css的代码了，大家可以直接看项目代码或者从开发者工具中审查元素观看。如果有问题可以私聊我，我觉得问题不大。 首先，准备…

如果你想用 canvas 画图，那不妨试试 Fabric.js 。跟着本文一步一步操作，一定可以入门 Fabric.js