ITman彪叔 - 博客园

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

canvas绘制飞线效果

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

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

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

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

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

webgl径向模糊实现体积光

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

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

webgl实现径向模糊

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

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

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

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

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