UI工程师的机器学习之旅(三)K近邻识别手写数字

K近邻算法基本原理:

存在一个样本数据集合,并且样本集中每个数据都存在标签,即我们知道样本集中每一数据项与所属分类的对应关系;

输入没有标签的新数据后,将新数据的每个特征与样本集中数据对应的特征进行比较,然后算法提取样本集中特征最相似数据的分类标签;

一般来说我们只选择样本数据集中前K个最相似的数据,这就是K近邻算法中K的出处,通常K是不大于20的整数;

最后前K个最相似数据中出现次数最多的分类,即为新数据的分类。

Read More

聊一聊全景图

前段时间学习了ThreeJS项目里边关于全景图的案例之后,自己动手练习了一下,实现了两个全景图的例子,分别如下:

WebGLRender 球型全景图

WebGLRender 立方体全景图

CSS3DRender 立方体全景图

CanvasRender 立方体全景图

CanvasRender 立方体全景图可能是因为浮点数计算精度的原因导致每个面的衔接处有灰色间隙;

WebGLRender 球型全景图由于贴图的原因导致南北极存在扭曲的情况,通过把球型全景图转换成立方体全景图可以改善这个问题,但是不能完全避免;

网络不好的情况下第一次打开可能会比较慢,因为全景图资源比较大。

实现原理比较简单,只要把摄像机放在模型中心,然后把全景图渲染到模型内表面即可。

Read More

在 MAC 操作系统中安装 Mxnet 并运行其中的梵高绘画风格模拟例子

前些天偶然间看到大家在讨论某些活动页面风格不一致的情况,然后想到了很久以前看过的一篇文章关于深度学习框架 Mxnet 的文章;

文章中有一个例子能把任意图片转换成梵高的绘画风格,结合上述大家讨论的情况,开了个脑洞:

能不能通过这个例子做一个判断页面风格是否一致的工具呢?

Read More

常用滤镜算法以及WebGL实现

如果你想仔细了解文中 WebGL 实现的滤镜算法,首先你得具备一些原生 WebGL 知识,但是如果你只是想大概了解滤镜算法的作用和规律,不具备原生WebGL知识也没关系,建议跳过具体实现,聚焦文字说明、函数、图形、矩阵等;

另外下述部分关于滤镜的 WebGL 实现都是参考于 WebGLImageFilter,因此你也可以认为这篇文章有部分内容是对WebGLImageFilter这个类库源代码的简单解析。

Read More

移动端网页绝对自适应方案总结

网页自适应是个涵盖很广的话题,这里我只简单总结下移动端网页绝对自适应,简单来说如果设计师提供给你的设计稿是750px宽,此时里边有一张图片宽高均为375px;那么在IPhone6 Plus手机里边屏幕宽为414px时该图片的渲染宽度应该为207px,这种保证元素尺寸、字体大小在屏幕中所占比例大小始终不变的方式我称之为移动端网页绝对自适应

目前来说我总结了大概有如下五种方式来实现移动端网页绝对自适应

Read More