前言 上篇主要是理论的概述,本篇会多些实践,来讲讲canvas的基础用法,并包含一些基础三角函数的应用,推荐没有canvas基础的朋友阅读,熟悉的朋友可以跳过. 本人能力有限,欢迎牛人共同讨论,批评指正. 一起来画画吧 canvas的API有很多,如果一一列举30分钟你是绝对看不完的,而且怎么流水账还不如自己去看文档呢(笑),本教程的思路是用实例一步一步从无到有讲解基础用法. canvas相关文档 准备工作 布置画布:通过添加<canvas>标签,添加canvas元素: 获取画布:通过<…

前言 本文虽说是基础教程,但这是相对动画/游戏领域来说,在前端领域算是中级教程了,不适合前端小白或萌新.阅读前请确保自己对前端三大件(JavaScript+CSS+HTML)的基础已经十分熟悉,而且有高中水平的数学和物理知识.demo采用ES6编写,遵循Airbnb规范,不依赖第三方框架或库,请在现代浏览器里运行. 大部分例子来自<Foundation HTML5 Animation with JavaScript>,感谢这本书作者的辛劳和启发.本教程也可以算是该书的精(tian)简(you)…

前言 一路沿着本系列教程学习的朋友可能会发现,前面教程中都尽量避免提及质量的概念,很多运动概念也时刻提醒大家这不是真实的物体运动.因为真实的物体运动其实跟质量都是密不可分的,而且质量的引入自然必须提及力学概念,所以为了不内容冗余才忽略了质量. 从本篇开始,将会正式引入物理力学概念,给每个物体赋予质量概念,为了更加真实的模拟现实环境的物体运动. 阅读本篇前请先打好前面的基础. 本人能力有限,欢迎牛人共同讨论,批评指正. 动量与动量守恒 [科普]一般而言,一个物体的动量指的是这个物体在它运动方向上保…

前言 本系列前几篇中常出现物体跑到画布外的情况,本篇就是为了解决这个问题. 阅读本篇前请先打好前面的基础. 本人能力有限,欢迎牛人共同讨论,批评指正. 越界检测 假定物体是个圆形,如图其圆心坐标即是物体的x轴和y轴坐标. 越界是常见的场景,一般会有两种场景的越界:一是整个物体移出区域,二是物体接触到区域边界.我们以画布边界为例进行讨论,示例中矩形边界即是: let top = 0; let bottom = canvas.height; let left = 0; let right = can…

前言 本篇主要讲坐标旋转及其应用,这是编程动画必不可少的技术. 阅读本篇前请先打好前面的基础. 本人能力有限,欢迎牛人共同讨论,批评指正. 坐标旋转 模拟场景:已知一个中心点(centerX,centerY),旋转前物体ball(x1,y1),旋转弧度(rotation):求旋转后物体(x2,y2).(如下图) 坐标旋转就是说围绕某个点旋转坐标,我们要依据旋转的角度(弧度),计算出物体旋转前后的坐标,一般有两种方法: 简单坐标旋转 灵活运用前章节的三角函数知识可以很容易解决,基本思路: 计算物体…

前言 本篇主要讲解关于计算机颜色系统的概念,后续结合一些canvas的应用.因为是"你不知道也没关系"的边缘知识,所以作为本系列教程的扩展,没有兴趣的同学可以跳过. 开始我们万紫千红的故事吧! 本人能力有限,欢迎牛人共同讨论,批评指正. 先从老朋友CSS讲起 我们熟悉的CSS风格颜色表示方式,大体有下面几种,canvas大体是直接沿用这些写法的,但最后包含透明度的写法有些许不同. #RRGGBB:十六进制格式,红绿蓝分别用两位十六进制数表示. #RGB:简写的十六进制格式,转换成6位格…

前言 本文是接续系列教程的extra1,主要是介绍颜色系统在canvas中的应用. 本来是与extra1一起成文的,因为segmentfault莫名其妙的字数限制bug只能分割放送了. canvas操纵像素 你如果认为canvas只是画图工具,那接下来的操作会颠覆你的认知.canvas提供api可以获取画布上任何一个像素,并可以自由的操作他们. 获取像素 直接访问像素的功能由canvas上下文中的ImageData对象提供,它提供了以下一组方法,都会返回ImageData对象. getImage…

前言 解决运动和碰撞问题后,我们为了让运动环境更加自然,需要加入一些环境因子,比如常见的重力加速度和模拟摩擦力. 阅读本篇前请先打好前面的基础. 本人能力有限,欢迎牛人共同讨论,批评指正. 重力加速度 [科普]重力加速度是一个物体受重力作用的情况下所具有的加速度.也叫自由落体加速度,用g表示.方向竖直向下.通常指地面附近物体受地球引力作用在真空中下落的加速度,记为g.为了便于计算,其近似标准值通常取为980厘米/秒的二次方或9.8米/秒的二次方. 真实的物体是有质量的,所以其重力加速度是由于重力…

最近在学习RabbitMQ,在网上找了不少资料发现都特高端.动辄集群部署,分布式架构什么的,对于一个初学者实在不够友好.心想求人不如求自己,为什么不自己整理一套资料呢?于是<30分钟学玩转RabbitMQ>诞生. 一.准备工作 据说RabbitMQ是可以部署到Windows环境的,不过作为一个专业级的开发人员怎么能够让这样的事情发生呢?自然我们的准备工作从Linux开始.首先在虚拟机中安装CentOS 7,选择英文,最小安装,默认开启网络以及创建一个root用户: 完成以后进入系统,由于最小安…

作为帅气小编,我已经把python一些模块的甩在这儿了qwq,只要你拿到这些干货,包你玩转python,直接冲向"大佬"的段位,如果已经学了C或者C++或者说如果你需要你的一段关键代码运行得更快或者希望某些算法不公开,你可以把你的部分程序用C或C++编写,然后在你的Python程序中使用它们.Python入门教程.热爱python的小伙伴可以加我Q群867067945,里面都是想学习编程的小伙伴,还有大佬专门给你解答编程类的难题哦python web开发2.Python网络爬虫Pyth…