netcy的专栏

这场疫情打乱了所有人的节奏，让很多人期望的自由工作变成了现实，过上了穿着睡衣开视频会，躺床上撸猫回邮件的生活。 但是在家办公到底怎么样呢？在家远程办公和传统办公相比，有劣势也有优势。 远程办公的最大优势在于，可以解除物理的隔阂更加灵活的处理各种情况。 比如这次疫情，没法去公司办公，通过远程办公至少可以极大的减少损失。从2月3号开始，我们开始在家里面远程办公。 到现在为止，我们团队已经工作了快...

在很多可视化项目中，会用到不少的小图标或者简单的chart图表之类的。实际项目开发中，往往是让设计人员把相关的图标做成矢量图或者位图，交给开发人员，开发人员直接使用到实际的项目中去。事实上，一些简单的图标，也可以直接使用代码来绘制生成。通过代码来生成的优势在于：一是不占用太多的空间，太多的图片资源对于项目的加载会有性能瓶颈。二是，通过代码生成的图标，可以通过配置属性来实现不同的风格，甚至...

楔子最近要做一个基站站点的可视化呈现项目。 我们首先尝试的是三维的可视化技术来程序，但是客户反馈的情况是他们的客户端电脑比较差，性能效率都会不好，甚至有的还是云主机。 因此我们先做了一个性能比较极致的3Ddemo，如下图所示：为了能够尽可能的性能最优，所以想了各种性能优化手段。当然效果上也会有折扣，这个demo与我们本身的一些产品比如3D机房等相比较，效果上面肯定有了很大的差距。不过性能方面还...

前几天周六的时候，公司组织了团建活动。 租了一辆中巴车到景区，大家集中在公司楼下上车。其中一个人不小心迟到了（在此还是建议大家不要迟到，要多守时哈），最终我们决定先走。然后人事小姑凉和师傅商量，是否可以到指定的地点，让那名迟到的同事打车和我们汇合，我们接上他，然后再去目标地点。师傅说可以，然后说了，从三环下来的地方的xxx路，哪儿有个酒店啥的。可以在哪儿等下。 因为大家都不熟悉，所以人事小...

0x01项目背景本项目是一个机器人制证的可视化系统。 其中包括制证设备的显示和监控，质检设备的显示和监控；同时也包括AGV机器人的显示和监控。 制证设备用于制作证书，质检设备用于合格检查，而AGV机器人用于运输；AGV机器人还需要监控电量和充电情况和行进位置。0x02设计稿接到项目之后，大家就开始开心(谁知道呢)得干活了。 首先就是要出设计稿，设计小姐姐在经过和客户多次的交涉讨论之后，交付了...

0x00 楔子最近做的一个项目，是一个油田三维可视化监控的场景编辑和监控的系统，和三维组态有些类似，不过主要用于油田上。 效果如下图所示：首先当然是上模型，设计人员跟进。 有了相关的模型，使用我们开发的一个编辑器，通过模型拖拽编辑，管路编辑等等，很快就能够编辑出以上的场景：一切进展的都很顺利。 直到客户说，我们有一个WPF开发的桌面端程序，我们需要把你们的三维嵌入到桌面端。0x01 寂静...

需求这是从一个项目中提取的需求。 大致的思路是： 通过获取后端的一系列人员的点位信息，在前端模拟人员的一段时间内的行动过程。我们的开发人员首先想到的思路是，把获取的点位列表信息，每两个取取来，组成一条直线路径。然后基于每一条直线路径，创建一个动画Animate对象。（Animate是我们内部的一个管理/播放动画的类）。其中创建每一个Animate动画的代码大致如下：new Animate(...

转换任意颜色为RGBA格式前端编程过程中，经常会遇到要把各种颜色格式（比如 “red”、“#F00”、“#FF0000”等）转换成RGBA格式，搜索网络也可以发现一堆的解决方案：此处介绍一种方法： 通过canvas的像素获取方法，来获取任意颜色的RGBA数值。大致步骤如下：首先创建一个尺寸为1*1的canvas，并获取canvas的绘制上下文ctx设置ctx.fillStyle为指定的颜...

最近遇到了一个需求，是要去掉一张图片的黑色背景，如下图所示：如果使用OPENCV ，加上一些图像处理的算法，是可以实现去除任何背景的。但是由于这个需求就是去掉黑色背景，感觉没必要用到哪些比较复杂的算法。于是打算在网络上搜索了一下，开始没有搜搜到，倒是搜索到一篇用ps如何来去掉黑色背景的思路：去掉图片黑背景输出为透明png(算法和工具)但是里面主要是说用PS的操作，而且里面说的原理，也不是很...

我们知道，清空canvas画布内容有以下两个方法。第一种方法是cearRect函数：context.cearRect(0,0,canvas.width,canvas.height)第二种方法就是用原值重新设置一下canvas的宽（或者高）canvas.width = canvas.width// or canvas.height = canvas.height第二种方法可以起作用，...

<div class="iteye-blog-content-contain" style="font-size: 14px"></div> 在最近给客户交付的一个项目中，客户反映系统跑一段时间就会奔溃掉。我的第一直觉就是可能发生了内存泄漏。复现bug为了能够让bug复现，我让开发的小伙，先把模拟系统在本地跑起来。要知道，bug复现是很重要的。bug复现，能够...

本文将会列举并说明JavaScript 把一个number（或者numerical的对象）转换成一个整数相关方法。使用parseIntparseInt的语法如下：parseInt(string, radix)参数string的表示要解析的字符串，也可以是一个对象，会自动调用对象的toString函数得到要解析的字符串。parseInt的第二个参数，可以指定要解析的数字的基数，注意该值...

本文介绍JavaScript的展开操作符(Spread operator)...。本文适合ES6初学者。你可以通过展开操作符(Spread operator)...扩展一个数组对象和字符串。展开运算符（spread）是三个点（…）,可以将可迭代对象转为用逗号分隔的参数序列。如同rest参数的逆运算。用于数组以数组为例，首先创建一个数组，consta=[1,2,3],...

本文适合JavaScript初学者。一元正号介绍一元正号运算符(+)位于其操作数前面，计算其操作数的数值，如果操作数不是一个数值，会尝试将其转换成一个数值。 尽管一元负号也能转换非数值类型，但是一元正号是转换其他对象到数值的最快方法，也是最推荐的做法，因为它不会对数值执行任何多余操作。转换字符串一元正号可以用于转换数值字符串为数字，比如如下代码：+"123"//12...

本文适合JavaScript初学者阅读剩余操作符之前这篇文章JavaScript展开操作符(Spread operator)介绍讲解过展开操作符。剩余操作符和展开操作符的表示方式一样，都是三个点 '…',但是他们的使用场景会不同。剩余参数定义函数的时候，如果函数的参数以… 为前缀，则改参数是剩余参数（rest parameter）。剩余参数表示参数个数不确定的参数列表。在函数被...

前言在WebGL1中，纹理的图片和采样信息都是写在纹理对象之中.采样信息告诉GPU如何去读取贴图上图片的信息。如果我们希望从同一个图片多次读取像素信息，但是每次读取的时候使用的过滤方式不一样, 此时我们需要创建两个不同的纹理对象。"你说这样是不是很烦啊"WebGL: “。。。”采样器对象在WebGL2中，引入了采样器对象，使用采样器对象，可以把纹理的过滤方式封装到采样器...

这是一个项目中遇到的实际需求。场景是一个智能仓库管理系统，场景里面有直线和曲线构成的环穿轨道。环穿轨道上面会有小车运动，后台推动小车的两个点位A和B，其中A和B都会在轨道上面，前端需要根据这两个推送点，自动播放小车从A点沿轨道到B点的动画。下面是项目截图：项目中使用的是二次贝塞尔曲线，所以本文也主要以二次贝塞尔曲线为讲解重点。要实现上述动画，需要首先确定A点和B点在曲线上面的比例值ta和tb...

在实际的项目中，我们经常会有如下的需求：从一个map中获取某key的值，如果发现对应的key的值为null，则为该key创建一个值(一般为初始值)，然后把这个值存回到map中，代码如下：```var value = map[key];if(value == null){        value = "";        map[key] = value;}``...