canvas破苍穹

时间 2019-11-30

标签 canvas 苍穹繁體版

原文原文链接

`canvas`破苍穹

（一）陨落的天才

“canvas之力，三段！"javascript

望着浏览器上暗淡无光的一段话，少年面无表情，唇角有着一抹自嘲（别问我怎么一边面无表情通常自嘲，我不知道）。php

”xcharts，canvas之力，三段！级别：低级！“浏览器旁，一位中年程序员，看了眼控制台打印的语句，语气漠然地将之公布了出来。java

秃头男（等等！刚刚不还只是中年程序员吗？）话刚刚脱口，便不出意外的在人头（？）汹涌的的机房带起一阵嘲讽的骚动。git

”三段？嘿嘿，果真不出我所料，这个‘天才’仍是只会context.arc!“程序员

”哎，这废物真是把咱们charts界的脸都丢光了。“github

”真不知道Echarts大人从哪儿捡回来这么个废物!“web

”曾经他学console时进步多么神速啊，现在怎会愚笨至此！“算法

xcharts缓缓抬起头来，露出一张有些清秀的稚嫩脸庞，漆黑的眸子木然从那些嘲讽的同龄人身上扫过，嘴角的自嘲,彷佛更加苦涩了。canvas

”这些人，都如此刻薄势力吗？或许是由于以前我会console.group，而他们只会console.log时对我曾经崇拜过，谦卑过，因此，现在想要讨还回去吧。“苦涩地一笑，xcharts落寞地转身，安静地出了机房，孤单的身影与后方熙熙攘攘的人群如相隔两端。设计模式

第一章后续本身脑补哈，就不水字数了。

(二) cavnas大陆

夜色漆黑，只有显示器和RGB灯条发出了一些光亮。

xcharts孤独地坐在电竞椅上，凝望着《计算机图形学》，想着这么久了仍是看不懂，感到一阵沮丧，又想起下午他们的嘲讽，不由有些恍惚：”十年了“。

在xcharts的心中，有一个仅有他本身知道的秘密，他并非这个世界的人，或者说，他的灵魂不是这个世界的人，他来自一个叫地球的蔚蓝星球，是一个php程序员，他也不知道为何会发生这样奇怪的事,反正无论怎么样，他来了，而且回不去了。

他穿越过来时变成了一个婴儿，仍是被人遗弃的那种，是Echarts大人碰巧碰见将他带回来的。随着年龄的增加，对这个世界，也有了模糊的了解。

这个世界叫作canvas大陆，大陆上没有php，也没有c，虽然有javascript，但它只是为canvas服务的，canvas，才是大陆的惟一主调！

在这片大陆上，canvas的修炼，在无数代人的努力下，几乎已经发展到了巅峰的地步，而随着移动端浏览器的统一，几乎全部人都会学习canvas。无论什么应用，都能用canvas写出来。

随着canvas的发展，根据做用的不一样，分出了好几条主要的分支，它们是：

游戏引擎
可视化
其它应用

而全部分支又分为3d和2d。其下不知道有多少更细分的分支。canvas之力就是修习的成果。可是无论怎么样，canvas之力评判的标准是同样的，完成更多的功能，更酷炫的效果，更少的内存占用和更快运行效率。

xcharts由于前世在培训班学php时用过一点js，因此初来时在js方面一枝独秀，但到使用canvas时，没有学过设计模式、数据结构与算法、计算机图形学的他只会根据api完成简单的功能，对如何实现复杂的应用根本无从下手——而这些东西，在其余人的脑海里与生俱来，他不敢让外人知道本身的不同凡响。因此这些年来才会从天才堕落成废物！

”再过半个月就是年终考核了，届时canvas之力还没达到九段的话，就要被驱逐出去了，怎么办啊。“想起半个月后的考核，xcharts心中不禁得一阵惶恐和难过。

”小朋友，别长吁短叹了“。

好了，金手指出场了，咱们去下一章。

（三）XRender

”老师，您真的能让个人canvas之力在半个月后达到九段？“xcharts带着惊喜和疑问的语气看向眼前的老者。

”没错，只要你用心跟着我学习便可！“

”好好好，那咱们如今就开始吧！“

”既然你这么着急，那咱们如今就开始吧，你是走的可视化图表的路子，你可知道渲染器？“老者淡淡地问道。

“我固然知道了。”这个xcharts仍是知道的，“要想将数据变成图表，也就是可视化，除了须要将数据进行处理，变成方便使用的结构，还须要将这些数据渲染到canvas上成为能够看见的信息，这一步由于要考虑到多种环境，因此须要专门的渲染器来完成这份工做。”

“不错，你可修炼出了渲染器？”

“呃”，xcharts闻言有点羞愧，其余人这个年龄都已经初步修炼出了渲染器了，“想好了名字算吗？叫XRender”

“你。。。”，听到这话，饶是老者脾气好，胡须也不由一阵颤抖，“算了，这可有可无，xrender是吧？即便它是个空壳，接下来半个月我也能教你如何将它打形成拥有九段canvas之力的渲染器！”

“首先你要知道一个渲染器一般都是采用MVC模式的，也就是由数据驱动视图，至于C，咱们先无论。”

接着渲染器一般由这几个部分构成：

好了，今天的canvas破苍穹就到这里。戏说虽好，要真的学习仍是要严肃一点。

本系列只是趣味引入，真正的知识点请看正文。