随笔分类 - 可视化
摘要：问题 已知：from ，to 两点的坐标，如何求两点连线的旋转角度？ 可以通过余弦定理求解三个角的度数。具体说明如下： 在三角形中,已知边A、B、C, 且A、B、C所对的内角分别是a、b、c, 则： cosa=[B²＋C²－A²]/(2BC) cosb=[A²＋C²－B²]/(2AC) cosc=[
阅读全文
摘要：大家，新年好！ 历史文章： 数据可视化 gojs 简单使用介绍 gojs 如何实现虚线(蚂蚁线)动画？ 本文介绍的是在使用 gojs 制作图的过程中，你可能会碰到的问题的一些解决方案。 gojs 是一个非常强大的可视化关系的js库。 1. 取消更新动画 问题：更新数据的时候，会触发渲染，有渲染动画，
阅读全文
摘要：用个小 demo 记录一下，如何在 canvas 上操作图像。 绘制图像，并自适应水平垂直居中 图像灰度处理 提取图像的主题色：平均值法（单色背景）、最多色值法（双色背景） 点击在线体验 绘制图像，并自适应水平垂直居中 绘制图像 利用的是 canvas 的 api drawImage void ct
阅读全文
摘要：做可视化决策的过程，为了节省人的工作量及提效，一个好的方案是推荐。 现有的智能可视化推荐系统分为两类: 基于规则的 和 基于机器学习的。 前者一般是根据专家经验或实验得到的可视化准则; 后者则是直接学习从数据到可视化的模型。 本文是在研究基于规则的可视化推荐的过程中，查看背后源码规则部分实现的过程后
阅读全文
摘要：在绘制 dag 图时，通过节点和来箭头的连线来表示节点彼此之间的关系。而节点常常又带有状态，为了更好的表示节点之间的流程关系，loading 状态的节点，与后续节点之间，需要用 动画着的虚线 表示，表示正在处理中，处理完才会变成实线。原理同页面没加载出来之间，加个 loading 提示，能提供更好的
阅读全文
摘要：曲线美 qq 浏览器宣传页 曲线图 水波图 桑基图 原理 命名：贝塞尔曲线（Bézier curve） 组成：由起点、终点、控制点组成。 说明：其中控制点的个数可以是0-n, 0个控制点的时候为一阶贝塞尔曲线（一条直线），1个控制点的时候为二阶贝塞尔曲线，以此类推。 重要性：是计算机图形学中相当重要
阅读全文
摘要：始终如一 需求 需要利用 echarts 实现区间柱状图，效果如下： 效果来源于：g2-柱状图 借鉴 echarts 的 demo 柱状图-深圳月最低生活费组成 柱状图-阶梯瀑布图 demo 区间实现思路（视觉欺骗） 通过 bar 的 series 的 stack （堆叠）属性，实现柱子堆叠。 再通
阅读全文
摘要：我是没想法啦（一开始）。其实，好久没接触 echarts 了，至少有一年多了，想起以前折腾地图的情景了🙃。 需求 两张图。没有再多了... 柱状图： 条形图： 探索一 俗话说，不知道怎么办的时候，百度来帮忙。百度一下。 输入关键字：echarts 柱状图 转换率 打开第一篇的结果：echarts实
阅读全文
摘要：本文是关于如何使用可视化库 gojs 完成节点分组关系展示的，从零基础到实现最终效果。希望对使用 gojs 的小伙伴有帮助。 1. 节点分组需求及 demo 展示 需求 能正确展示组的层次，以及节点之间的关系。 单选节点、多选节点，获取到节点信息 选中组，能选中组中的节点，能获取到组中的节点信息 选
阅读全文
摘要：[TOC] 本文是关于如何使用可视化库 gojs 的介绍及使用时的小技巧。 1. gojs 简介 "gojs" 是一个用于构建交互式可视化图的 js 库，使用可自定义的模板和布局构建复杂节点、链接和组，从而构建出简单到复杂的各类图，如流程图、脑图、组织图、甘特图等。而且提供了许多用于用户交互的高级功
阅读全文
