ITman彪叔的博客,微信公众号:ITman彪叔。欢迎对canvas、webgl、图形学感兴趣的读者订阅专栏。 点击下面链接可以订阅: [canvas高级进阶] https://xiaozhuanlan.com/canvas [webgl入门到高级进阶]https://xiaozhuanlan.com/webgl

2020年12月5日

利用canvas阴影功能与双线技巧绘制轨道交通大屏项目效果

摘要: 利用canvas阴影功能与双线技巧绘制轨道交通大屏项目效果 前言 近日公司接到一个轨道系统的需求,需要将地铁线路及列车实时位置展示在大屏上。既然是大屏项目,那视觉效果当然是第一重点,咱们可以先来看看项目完成后的效果图。 可以看到中间线路里轨道的效果是非常炫酷的,那么本文的主要内容就是讲解如何在can 阅读全文

posted @ 2020-12-05 17:54 ITman彪叔 阅读(758) 评论(0) 推荐(0) 编辑

2020年12月1日

webgl智慧楼宇发光效果算法系列之高斯模糊

摘要: webgl智慧楼宇发光效果算法系列之高斯模糊 如果使用过PS之类的图像处理软件,相信对于模糊滤镜不会陌生,图像处理软件提供了众多的模糊算法。高斯模糊是其中的一种。 在我们的智慧楼宇的项目中,要求对楼宇实现楼宇发光的效果。 比如如下图所示的简单楼宇效果: 楼宇发光效果需要用的算法之一就是高斯模糊。 高 阅读全文

posted @ 2020-12-01 10:37 ITman彪叔 阅读(666) 评论(0) 推荐(0) 编辑

2020年11月30日

可视化编辑器之数据源配置

摘要: 随着国家近来几次重要会议开展以及落地。企业转型及可视化布控迎来热潮。所以一款能效力于管理层——运筹帷幄、省力于运维层——降低维护成本的可视化编辑器是很有必要的。关键在于,它很轻便。 给大家展示一下最近一个竣工项目的效果图: 该项目实现了企业核心指标的实时观测,以及整体布控。另外其还易于上手。并且是由 阅读全文

posted @ 2020-11-30 15:20 ITman彪叔 阅读(287) 评论(0) 推荐(0) 编辑

2020年11月26日

基于路径集合的三维动画链

摘要: 目前数据信息可视化的发展趋势越来越快,纬度宽广、数量庞大、结构复杂的数据展示仅仅只依靠二维平面图表已经不能满足了。为了更加清晰,快速的认知和理解一份数据,构建基于现实的三维虚拟可视化效果,被广泛应用到各行业中,迅速成为信息数字化管理的重要组成部分。 三维场景还原了现实的虚拟效果,而各种各样的动画则赋 阅读全文

posted @ 2020-11-26 10:34 ITman彪叔 阅读(166) 评论(0) 推荐(0) 编辑

2020年11月19日

自动化车间3D可视化设计思路

摘要: 自动化车间3D可视化设计思路 随着国内制造业企业的高速发展,再加上政策支持,高效的生产模式和先进的管理方式越来越受到企业重视。更多的企业将工业信息化技术进行广泛的应用,比如MES系统、数字孪生以及生产管理可视化等技术的研究应用。 近期我们团队利用自主开发的大屏编辑器与3D编辑器结合做了一个智能实验室 阅读全文

posted @ 2020-11-19 14:50 ITman彪叔 阅读(818) 评论(0) 推荐(0) 编辑

2020年11月10日

canvas绘制飞线效果

摘要: 在我们做的可视化大屏项目中,经常会遇到飞线的效果。 在我们的大屏编辑器中,可以通过拖拽+配置参数的方式很快就能够实现。下面是我们使用大屏编辑器实现的一个项目效果: 中间地图就有飞线的效果。 抛开编辑器的快速实现不说,我们大致来说下canvas绘制飞线的大致原理。 贝塞尔曲线 飞线的路径主要是一个贝塞 阅读全文

posted @ 2020-11-10 16:57 ITman彪叔 阅读(859) 评论(0) 推荐(0) 编辑

2020年10月14日

拓扑/大屏/三维编辑器的设计与思考

摘要: 从去年年初开始,我们团队内部就在做两个编辑器: 3d编辑器 支持搭建3d场景。 拓扑/大屏编辑器 支持搭建大屏/拓扑/组态场景。 开发编辑器的主要目是为了提高团队内部项目的交付效率,目前 两个编辑器都引用到团队的相关项目中。当然,编辑器目前也支持和其他公司的项目合作。 下面是几个项目的示例图: 中间 阅读全文

posted @ 2020-10-14 15:19 ITman彪叔 阅读(385) 评论(0) 推荐(0) 编辑

2020年9月1日

webgl径向模糊实现体积光

摘要: 体积光介绍 首先,我们要确认一下什么是体积光。体积光通俗来说是我们能看见的”光路“,并不是所有灯光都会形成体积光效果,它是光照到大气中粒子散射后得到的效果(丁达尔效应)。我们有时候还会看到一束束光散开的效果,这是光在传播过程中遇到了障碍物(比如穿过云层、树木的光束)导致的。 根据物理原理,我们知道体 阅读全文

posted @ 2020-09-01 10:02 ITman彪叔 阅读(682) 评论(0) 推荐(0) 编辑

2020年8月25日

webgl实现径向模糊

摘要: 径向模糊简介 径向模糊,是一种从中心向外呈幅射状,逐渐模糊的效果。 因此径向模糊经常会产生一些中心的发散效果,在PS中同样也有径向模糊的滤镜效果。 径向模糊通常也称为变焦模糊。径向模糊(Radial Blur)可以给画面带来很好的速度感,是各类游戏中后处理的常客,也常用于Sun Shaft等后处理特 阅读全文

posted @ 2020-08-25 17:31 ITman彪叔 阅读(690) 评论(1) 推荐(0) 编辑

2020年8月6日

webgl实现发光线框(glow wireframe)效果

摘要: 在之前这篇文章, WebGL 单通道wireframe渲染 我们介绍了webgl如何实现单通道wireframe的效果。 本篇文章就是在此技术原理基础之上,来实现发光的wireframe效果。 要实现发光的效果 所谓的发光的效果,就是颜色的渐变。 渐变越慢,发光的效果越明显,渐变越快,发光效果越不明 阅读全文

posted @ 2020-08-06 15:30 ITman彪叔 阅读(698) 评论(0) 推荐(1) 编辑

导航

ITman彪叔的博客,微信公众号:ITman彪叔。欢迎对canvas、webgl、图形学感兴趣的读者订阅专栏。 点击下面链接可以订阅: [canvas高级进阶] https://xiaozhuanlan.com/canvas [webgl入门到高级进阶]https://xiaozhuanlan.com/webgl