学无止境

# 前言 深夜踩坑真的是太难了，呜呜 OpenCV 可以说是很早就接触了，之前用过 Python 版本的和 C++ 版本的。最近在学习前端方面的知识，做 WebGIS 和图像处理方面的开发，顺理成章就希望能将 OpenCV 用在前端上。查阅了一些资料，发现已经有大神做了将 OpenCV 用于 NodeJS 上的开发，其名为 opencv4nodejs。既然已经有了前辈探路，我们也就可以大胆开干了。万万没想到，踩坑之路已悄然开始，呜呜 npm 安装 opencv4nodejs 国内只有零星的几篇 Blog 有介绍，但是坑又没有踩完，所以想将自己踩坑成功后的经历记录下来，方便后面的小伙伴们～ #...

# 前言 作为一个三维地球，在场景中来点雨雪效果，貌似可以增加一点真实感。Cesium 官网 Demo 中有天气系统的实例，用的是 Cesium 中的粒子系统做的。效果如下图所示，粒子系统的本质是向场景中添加了很多物体，用 BillBoard 技术展现。这种实现方式有一个麻烦的地方就是当视角变化 (拉近、拉远、平移、旋转) 时，粒子就会变化，甚至会消失，很影响体验。考虑用 shader 的方式直接模拟雨雪效果，恰好发现了 Catzpaw 大神写的模拟雨雪的 shader，果断增添到 Cesium 中。 # 实验效果 # 代码 # 自定义 GLSL 代码 /** * 后期处理控制类 *...

# 实验效果 # 代码 # 自定义 GLSL 代码 const DynamicCircle = `uniform sampler2D colorTexture; //颜色纹理uniform sampler2D depthTexture; //深度纹理varying vec2 v_textureCoordinates; //纹理坐标uniform vec4 u_scanCenterEC; //扫描中心uniform vec3 u_scanPlaneNormalEC; //扫描平面法向量uniform float u_radius; //扫描半径uniform vec4 u_scanColor;...

# 前言 Cesium 在 1.46 版本中新增了对整个场景的后期处理 (Post Processing) 功能，包括模型描边、黑白图、明亮度调整、夜视效果、环境光遮蔽等。对于这么炫酷的功能，我们绝不犹豫，先去翻一翻它的源码，掌握它的实现原理。 # 实验效果 # 后期处理的原理 后期处理的过程有点类似于照片的 PS。生活中拍摄了一张自拍照，看到照片后发现它太暗了，于是我们增加亮度得到了一张新的照片。在增加亮度后发现脸上的痘痘清晰可见，这可不是我们希望的效果，于是再进行一次美肤效果处理。在这之后可能还会进行 n...

# 前言 Viewer 是 Cesium 渲染器的核心功能，直接将地图和场景显示在浏览器中 # 详细设置 按需设置 var viewer = new Cesium.Viewer( 'cesiumContainer', { animation : false, // 是否创建动画小器件，左下角仪表 baseLayerPicker : false, // 是否显示图层选择器 fullscreenButton : false, // 是否显示全屏按钮 geocoder : false, // 是否显示 geocoder 小器件，右上角查询按钮 homeButton...

今天没有加班嘻嘻～ 晚上去大超市买了茄子和土豆 在家自己做了地三鲜，蒸了米饭，烧了汤 开心 o (￣▽￣) ブ 挺希望有人能和我一起吃饭的＞︿＜ 安～

# 前言 可缩放矢量图形的一大优势（除了它们可以被无限缩放而没有质量损失之外）是一旦你知道了基本的原理，无需打开绘图程序你就能很容易地手写出一些简单的形状。 只要很少的几行代码你就可以拥有你的自定义图标，而且你还很清楚每个图标是怎么组合出来的。当你创建自己的 SVG 时，你可以确保以最有效的方式来编写它们，并且当你在站点中使用它们时，你拥有最大的控制权。 在本教程中，我们将涵盖手写 SVG 的所有基本原理，但我不会用一个仅仅是丢出一系列相关形状和属性的文章来烦你们。相反，你们会通过实践来学习如何手写 SVG ，创建出本教程开头那张图片上所列的 6 个图标（在线示例）。在此过程中，你将会用到手写...

加班很烦，因为在下班后我有自己想做的事。 但不知道啥时候起，加班成了理所当然的事，为什么？ 还想吐槽一件事，提需求的人果然是最讨厌的。 想回学校了，想静下心来学习，搞科研。 晚安。

# 环境介绍 项目环境 版本 命令 NodeJs v12.18.3 node --version Npm v6.14.6 npm -v vue/cli v4.5.6 vue --version vue v2.6.12 npm list vue webpack v3.12.0 npm list webpack cesium v1.74.0 npm list cesium # 创建一个 Vue 项目 全局安装 vue/cli 和 vue/cli-init npm install -g @vue/clinpm install -g @vue/cli-init 创建一个基于...

# 最终效果 话不多说，先上效果 # 相关知识点 主要用到 CZML 相关知识 CZML 是一种用来描述动态场景的 JSON 架构的语言，主要用于 Cesium 在浏览器中的展示。它可以用来描述点、线、布告板、模型以及其他的图元，同时定义他们是怎样随时间变化的。 详情可看：CZML 介绍 我这里就不过多赘述了。 # 主要代码 var czml = [ { id: "document", name: "CZML Path", version: "1.0", clock: { interval:...