可视化
文章平均质量分 61
各种数据可视化技术探讨研究
X01动力装甲
欢迎进群(959261248)学习交流。
展开
-
g6 Dagre Layout VS dagre
左图连线更加粗暴,右图更加智能,但导致弯曲也更多,也导致当节点和连线增多的时候 画布区域更大。层级划分有区别,连线不同。原创 2022-11-17 18:18:49 · 708 阅读 · 0 评论 -
SVG filters feColorMatrix
SVG filters feColorMatrixfeColorMatrixThe SVG filter element changes colors based on a transformation matrix. Every pixel’s color value [R,G,B,A] is matrix multiplied by a 5 by 5 color matrix to create new color [R’,G’,B’,A’].| R' | | r1 r2 r3 r4 r原创 2022-04-12 18:26:21 · 780 阅读 · 0 评论 -
SVG制作说明
SVG制作说明SVG制作说明我们公司所做的系统,不仅只是展示在电脑上,大多还会用在大屏展示上。因此我们需要得图片格式不仅仅只是ipg或者png,而是需要一种任何种设备上展示都不会失真的格式,这种格式就是SVG格式。如果你不接触大屏设计这块领域,可能就不会熟悉SVG,那么作为设计师该如何制作SVG呢?制作SVG可以在AI或者Sketch中绘制所要得形状就可以,只是导出得时候有几种不同的方式,导出方式的不同对应的图片文件代码也不同。本篇文档会分三部分(SVG制作要求、导出及遇到一些问题得解决方法)进行说明原创 2022-03-17 15:47:44 · 3842 阅读 · 3 评论 -
SVG文件使用操作
SVG文件使用操作制作方法使用 illustrator 生成svg文件,选择”文件”—"导出”存储为svg格式,弹出svg选项框,生成svg代码。动画格式2.1 三种动画状态 svg文件一般有三种动画状态,包括静止状态、告警状态、运转状态。有些文件还包括离线在线状态(如风冷热泵、空气源热泵)、开启关闭(如灯泡、灯开关)。每个svg代码里的状态统一设置:静止:<g id=”BASE"> ,没有动画显示控制。运转:控制运转状态的不显示。告警:控制告警状态的不显示。与运转原创 2022-03-17 15:42:17 · 1940 阅读 · 0 评论 -
three.js开发打赏码
有缘一起写代码啊原创 2018-04-21 17:58:00 · 577 阅读 · 0 评论 -
墨卡托投影和高斯-克吕格 (Gauss-Krüger) 投影
高斯-克吕格 (Gauss-Krüger) 投影高斯-克吕格也称作椭圆体版本的横轴墨卡托投影,因为它与墨卡托投影类似,不同之处在于高斯-克吕格的圆柱体沿经线而不是赤道接触球体或椭圆体。通过这种方法生成的等角投影不会保持真实的方向。中央经线位于感兴趣区域的中心。这种中心对准方法可以最大程度减少该区域内所有属性的变形。此投影最适合于南北分布的地区。球体版本的投影由 Johann H. Lambert 于 1772 年提出。使用椭圆体校正的第一个公式由 Carl F. Gauss 于 1822 年开发。高斯-原创 2021-12-16 16:37:30 · 23204 阅读 · 2 评论 -
three.js元宇宙开发实战
three.js开发元宇宙计划书什么是元宇宙?这不重要,重要是我们在做。你搞个网站,你说这不是网站,这是元宇宙,他就是。你搞个游戏,你说这不是游戏,这是元宇宙,他就是。你吹个牛逼,你说这不是吹牛逼,这就是元宇宙,他真的就是。我就用3D写几行代码,我说他是元宇宙,他就是!话不多说,直接开整。虽然不知道要做什么,但是不重要,重要的是我们在做。 1:新建文件夹。 2:选择框架前端就Angular吧,3D就three.js。Babylon.js也不错,作为备选方案。 3:新建项目 4: 挖原创 2021-12-09 15:36:56 · 21355 阅读 · 7 评论 -
20个更好的数据可视化想法
20个更好的数据可视化想法我们设计的应用程序正变得越来越受数据驱动。对高质量数据可视化的需求与以往一样高。我们周围到处都是令人困惑和误导性的图形,但我们可以通过遵循这些简单的规则来改变这一点。1. 选择正确的图表类型选择错误的图表类型或默认使用最常见的数据可视化类型可能会混淆用户或导致数据误解。相同的数据集可以以多种方式表示,具体取决于用户希望看到的内容。始终从您的数据集和用户需求开始。四组图表应用分组:关系、比较、组合、分布2.根据正负值使用正确的绘图方向不要在基线的同一侧绘制负值和正值。原创 2021-11-12 15:19:25 · 357 阅读 · 0 评论 -
html和webgl中使用透明视频
html和webgl中使用透明视频关键词:webM, Adobe After Effect,Alpha + RGB , ffmpeg众所周知视频是不支持透明 的,其实他是可以支持的。不过一般播放器不支持,就算支持也会默认加上个黑夜的背景,不然播放器就会透过播放器本身直接看到看到后面的内容,于是你摸鱼又多了一个途径。要在网也中使用透明视屏需要几个必要的步骤:准备一个透明的视频用video标签把他加入到HTML中基本就OK了。webm格式的视频可以通过序列帧来合成或者通过带Alpha通道的mov原创 2021-09-30 17:08:06 · 1688 阅读 · 0 评论 -
p5.js typescript
p5.js typescripthttps://github.com/processing/p5.js/wiki/Positioning-your-canvasRelocating the canvasAlternatively, you may want to position your canvas in the midst of other information on your page. This can be done by using p5’s p5.Element.parent() f原创 2021-04-14 13:53:05 · 233 阅读 · 0 评论 -
Perlin snakes
<!DOCTYPE html><!-- saved from url=(0029)https://josephg.com/perlin/3/ --><html><head><meta http-equiv="Content-Type" content="text/html; charset=windows-1252"><title>Perlin snakes</title><style>.centerb.原创 2021-02-25 15:24:48 · 192 阅读 · 0 评论 -
p5.js line
通过绘制line的到到效果let a;let b;let direction; function setup() { createCanvas(320, 320); a = 0; b = width; direction = true; frameRate(50);} function draw() { a++; if (a > width) { a = 0; direction = !direc原创 2021-02-21 11:35:36 · 231 阅读 · 0 评论 -
Pixi6教程
网络是冰冷的现实是残酷的吃的苦是自己种下的果不计较多与少不期待成与败原创 2020-12-22 11:13:17 · 393 阅读 · 0 评论 -
在多边形内随机生成点
在多边形内随机生成点在多边形内随机生成点这个问题可以理解为判断一个点是否在多边形内。最近项目有个需求,需要在地图区域随机生成一些点。完成后效果如下:因为项目使用点是d3,所有优先考虑d3.js中多边形库。d3.polygonArea(polygon)Returns the signed area of the specified polygon. If the vertices of the polygon are in counterclockwise order (assuming a co原创 2020-12-22 10:50:40 · 2294 阅读 · 0 评论