Nivk经验分享

分享游戏世界的一点一滴

排序:
默认
按更新时间
按访问量

[WebAssembly入门]二,Hello,World!

本章节所需要准备的内容 1、最新版本的Chrome浏览器、最新版本的FireFox浏览器,其他(反正我不推荐) 2、一台能打字的电脑 正式开始 C语言部分 首先,我们先从C语言部分入手。 在这里,我们先创建一个空文件夹命名为 "WebAssemblyChap1" ,然后我们...

2017-12-30 17:27:23

阅读数:297

评论数:0

[WebAssembly入门]一,概念与环境搭建

在Web大行其道的今天,我们是否还需要更进一步?答案是肯定的。 现有的技术使得我们让在线互动变得可能,我们可以在浏览器中玩游戏、看电影、听音乐、与好友在线聊天等等。 看起来好像什么都能做,但是深入来讲,好像又什么都做不了。 接下来,我们就来看看我们还能做些什么。

2017-12-30 11:42:37

阅读数:279

评论数:0

JavaScript重载函数的实现【重构优化版】

前言:为什么我们需要JavaScript重载函数? 一把剪刀可以用来做什么? 剪刀可以用来剪纸,也可以用来剪鱼。 我们需要考虑的是更复杂的情况,如果我需要一剪刀下去,同时剪了“纸”和“肉”,这时才能达到某个神秘成就。我们该如何做? 如何使因参数变化而变化的函数内部实现更优雅?

2016-12-22 05:16:53

阅读数:617

评论数:0

在微信及支付宝下的音频自动播放

废话不多说,直接上代码。 // 微信、支付宝音频Hack方案 ; void function (win, doc, undefined) { // 原理:调用链中的某个事件被标识为用户事件而非系统事件 // 进而导致浏览器以为是用户触发播放而允许播放 Audio.proto...

2016-06-28 19:42:16

阅读数:1354

评论数:0

[软件渲染器入门]六-应用纹理、背面剔除以及一些WebGL相关

下面是本系列的最后一个章节了。我们将看到如何从Blender中导出贴图和纹理坐标来使我们的网格应用纹理。如果你已经成功的了解了之前的教程,应用一些纹理对你来说应该是小菜一碟。主要概念依旧是在每个顶点间插补一些数据。在本章的第二部分中,我们将看到如何提高我们的渲染算法性能。为此,我们将使用背面剔除来...

2016-03-02 01:53:15

阅读数:1899

评论数:1

[软件渲染器入门]五-平面着色和高氏着色

这可能是整个系列中最棒的部分:如何处理光照!在之前,我们已经搞定了让每个面随机显示一种颜色。现在我们要进行改变,计算出光的角度,让每个面有更好的光照效果。第一种方法叫做平面着色。它使用面法线,用这个方法我们也会看到不同面的效果。但是高氏着色则会让我们更进一步,它使用顶点法线,然后每一个像素使用3个...

2016-02-28 17:40:05

阅读数:2008

评论数:0

Obj模型导入器实现

注意:材质文件的读取还没有搞定,有空的时候更新。 void function () { function loadFile(url, syne, type, callback) { /// Ajax加载文件 /// 文件地址 /// 是否...

2015-12-01 16:51:44

阅读数:774

评论数:0

Html5应用屏幕适配方案

前言 相信现在不少人用Html5来制作手机页面,但是最大的问题就是屏幕的适配问题了。 虽然市面上有很多的移动框架可以帮助你解决不少问题,但一旦发生问题,很多人都会懵了。 本篇文章的目的就是为了让大家了解适配方案,以便解决问题。 屏幕适配的多种方案: 从上图我们可见,为iPhone5中微信打...

2015-12-01 16:23:02

阅读数:1202

评论数:2

用Canvas获取图像平均颜色

在Windows8、FireFox OS中有这样一种效果,虽然不是很重要,但是却能让整个系统变得和谐有趣。 这就是我们今天要讲的主要内容,图片平均颜色。 首先,我们可以使用canvas的getImageData函数获取所有像素的数据。 然后将所有的rgb三值各取平均值即可。 ...

2015-12-01 03:48:15

阅读数:2087

评论数:0

[软件渲染器入门]四-额外章节,使用技巧和并行处理来提高性能

由于我们的3D软件渲染引擎使用的是CPU运算,因此它将耗费大量的CPU处理时间。不过倒是有一个好消息,那就是CPU大多是多核心的。那么,我们可以想象一下使用并行处理来提高引擎性能。不过我们只能在C#中这么做,至于为什么Html5不可以,我将会稍后做出解释。我们在此篇章中可以学到一些简单的技巧,以此...

2015-11-29 23:26:26

阅读数:1241

评论数:0

[软件渲染器入门]四,填充光栅化的三角形并使用深度缓冲

本章我们将讲解如何使用三角形光栅化算法来填充三角形。然后,我们将使用深度缓冲,以避免在后面的面跑到前面来的问题。

2015-11-24 17:16:43

阅读数:2234

评论数:0

[软件渲染器入门]三,加载通过Blender扩展导出JSON格式的网格

3D建模有助于3D设计人员和开发人员之间的协作。设计人员可以利用其最喜欢的工具来构建场景或网格(3D Studio Max、Maya、Blender等……)。然后,他将作品导出为开发者可以加载的文件格式。开发者将最终将网格加载进实时3D引擎中。有很多种格式可以这么做。在我们的例子中,将使用Json...

2015-11-23 23:53:18

阅读数:3555

评论数:0

[软件渲染器入门]二,绘制线段和三角形来获得线框渲染效果

现在我们已经通过前面的教程编写相机、网格和设备对象的核心逻辑建立了3D引擎的核心,我们可以对渲染工作做一些增强了。下一步我们再连接点来绘制一些线条来组成一个线框渲染效果。

2015-11-23 19:14:31

阅读数:1908

评论数:0

[软件渲染器入门]一,编写相机、网格和设备对象的核心逻辑

我非常乐意通过一系列教程和大家分享如何建立所谓的”3D软件渲染引擎“。 ”软件渲染引擎“意味着我们将只使用CPU建立一个3D引擎,完全不使用GPU。(请不要忘记毁灭你的80386?) 我将与你分享C#、TypeScript以及JavaScript三种版本的代码。

2015-11-23 15:52:29

阅读数:3023

评论数:2

PhotoShop图层混合模式的Canvas实现

前端开发人员可能会遇到这样一个问题。 当设计人员给到一个PSD以后,会发现其中有些图层是有图层混合效果的。 这样会产生一个情况就是,我们为了这个效果而不得不将背景+带混合的图层切到一起。 当这样的元素多了以后,我们所切出的图片就会越来越大并且难以修改。 那么,本章我们将讲解如何使用Canvas...

2015-11-16 16:14:17

阅读数:1891

评论数:0

WebWorker 100%前端基础应用

前言: 本文为前端开发人员特别编辑,避免过多的原生理论、后台操作以及其他知识面的讲解。 适合您作为快速入门上手教程使用。 如有纰漏,还望在评论中提出,我将及时更正。 感谢您观看本文章教程,祝您工作生活愉快!^_^ 注意事项: 本文中所有链接除引用处会提到外,文章最后也会统一提示。 (本文不包含...

2015-11-12 12:10:06

阅读数:1148

评论数:0

电池Api的用法与应用

什么是电池API? 顾名思义,就是检测电池当前使用状态的API。 电池API的用途? 用途很多,举几个简单的例子: 当用户电池电量低,自动保存应用当前状态,以防不测。 当用户电池电量低,自动降低应用效果,以达到节省用户电量的目的。 当用户正在充电,自动切换到最高性能模式,保证应用的流畅和最大的...

2015-10-06 22:01:09

阅读数:992

评论数:0

JavaScript的重载函数实现

接触过Java、C#的人应该都比较了解重载函数。 但是JavaScript中并没有这样的机制是不是令人倍感烦恼呢? 不用怕!因为解决方法来啦!~ 你没用过Java、C#?你问我什么是重载函数? 嘛~那我就举一个简单的栗子好了~ fn("nivk", 21); // 我叫n...

2015-10-05 00:49:07

阅读数:687

评论数:0

场景转场动画的Canvas实现

废话不说,先上图 图1:转场前 图2:转场中(动画效果此处请看末尾链接) 图3:转场后 看完效果,我们来讲讲原理。 首先我们需要准备一张转场用的图。理论上所有图片都可以作为过渡图使用。 我使用的是一张带有天使翅膀图案的图片作为过渡图。 ...

2015-10-04 23:45:30

阅读数:948

评论数:0

JavaScript实现自定义对象的自定义事件

前言: 大家都知道,在使用JavaScript可以很方便的使用addEventListener函数给DOM对象快速绑定一个或多个事件侦听器。 我们又如何在JavaScript的自定义对象中使用此方法并触发事件呢?这就是本章节的核心内容了。 目的: 现在有一个需求,要求“a对象”能够...

2015-04-19 11:05:53

阅读数:1659

评论数:1

提示
确定要删除当前文章?
取消 删除
关闭
关闭