自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

苏一恒

坚持的,是那份热爱和冲动

  • 博客(30)
  • 资源 (1)
  • 问答 (1)
  • 收藏
  • 关注

原创 Redux DevTools插件无法获取到redux中的数据

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy1、第一次,【低版本插件诟病】当时没有翻墙,在国内某站上下载的Redux DevTools的crx,安装上后,一直不能用,也完全符合...

2019-08-30 20:28:28 2073

原创 【绘制】HTML5 Canvas绘制坐标轴(图文、示例)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy介绍使用Canvas绘制具有x,y轴的直角坐标轴,并在轴上绘制相应的刻度条。演示在线演示代码教程通过常量来计...

2019-08-30 10:30:16 6398 3

原创 【绘制】HTML5 Canvas 中线段、网格、像素边界(图文、示例)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy方法  Canvas绘图环境创建线性路径的方法:moveTo(),lineTo()。方法 描述 moveTo(x....

2019-08-29 10:58:34 1449

原创 【绘制】HTML5 Canvas 剪纸效果(镂空效果)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy圆环剪纸我们运用所学到的路径、阴影与非零环绕规则等知识,实现如图圆环剪纸(cutout)效果。这是用JavaScript...

2019-08-29 00:17:46 1932

原创 【绘制】HTML5 Canvas 中路径(path)、描边(stroke)与填充(fill)详细介绍(图文、代码示例)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy目录引入案例介绍在线演示效果图代码路径子路径填充路径中的“非零环绕规则”“非零环绕规...

2019-08-28 00:42:07 6435 1

原创 【绘制】HTML5 Canvas 阴影(图文、代码示例)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy阴影介绍Canvas的阴影效果可以作用在图形、文本及图像上,与四个属性值有关:shadowColor:CSS3格式的颜色...

2019-08-27 11:45:43 2739 1

原创 【绘制】HTML5 Canvas 中渐变色和图案(图文、示例)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy目录渐变色线性渐变用法代码示例效果演示放射渐变线性渐变和放射渐变的演示链接图案说明...

2019-08-26 20:39:12 1613

原创 【绘制】HTML5 Canvas 中颜色与透明度(图文、示例)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy核心属性Canvas实际应用中,颜色和透明度可以通过strokeStyle与fillStyle属性来设置。可以用global...

2019-08-26 17:24:21 4529

原创 【绘制】HTML5 Canvas 矩形的绘制(API+图文示例说明)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudyCanvas矩形APICanvas的API提供了三个方法,分别用于矩形的清楚、描边及填充。矩形的清除、描边与填充方法 描...

2019-08-25 11:00:41 912

原创 【绘制】HTML5 Canvas 绘制模型:canvas的浏览器渲染过程原理(详细理解和通俗理解)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy前提既然要使用Canvas,那就必须要有个很好的理解才行。想知道如何绘制Canvas图形、图像与文本的,其实需要了解阴影、alp...

2019-08-24 12:23:07 2171 2

原创 【基础知识】HTML5 Canvas 基础知识章末小结

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy章节回顾在本章节中,主要学习了canvas元素及其相关的2d绘图环境,并演示了该绘图环境中的一些重要特性,例如canvas元...

2019-08-24 01:59:39 334 2

原创 【基础知识】HTML5 Canvas 学习Canvas需要的数学知识:代数方程、三角函数、向量运算等(图文、举例)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy目录为什么要数学知识需要有哪些数学基础?1.求解代数方程2.三角函数2.1角的度量:角度和弧度2.2正...

2019-08-24 01:04:17 2253

原创 github.io上404 file not found的html页面找不到,其他页面都能正常显示(解决过程)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy问题在自己的github.io中,之前push的能够访问,刚刚push的不可以访问,配置、命名方面没有任何问题。解答网络...

2019-08-22 18:54:31 2546

原创 【基础知识】HTML5 Canvas 打印Canvas的内容(实现+进阶)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy目录引子初级阶段思路实现效果结果核心代码进阶阶段反思分析原理实现效果核心代码...

2019-08-22 18:05:49 6029

原创 【基础知识】HTML5 Canvas 项目橡皮筋选框局部放大器(图文)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy介绍Canvas橡皮筋选框局部放大器,是利用Canvas技术:拖拽鼠标创建选区,松开鼠标后自动放大选区的图像。演示链接h...

2019-08-22 12:45:20 1227

原创 【基础知识】HTML5 Canvas 动画项目-100个弹射小球(带控制器)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy介绍实现100个随机弹射的小球在Canvas中碰撞,另外用一个玻璃窗格作为控制台,控制动画的开始与暂停。演示链接http...

2019-08-21 23:14:42 1475

原创 【基础知识】HTML5 Canvas getImageData()和 putImageData() 在Canvas中绘制表面的保存与恢复(应用场景)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy应用场景在需要对画布内进行鼠标的细致操作时,需要用辅助线:1、鼠标进入画布时,先用getImageData()保存之前的ca...

2019-08-20 21:37:56 1487 3

原创 【基础知识】HTML5 Canvas键盘事件

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy注意在浏览器窗口按下某个按键时,浏览器会生成键盘事件。这些事件发生在当前拥有焦点的HTML元素上,如果没有元素拥有焦点,那么事件...

2019-08-20 19:52:12 1439

原创 【基础知识】HTML5 Canvas精灵表坐标查看器(详细教程)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy目录项目介绍项目演示详细步骤项目介绍本项目是精灵表(sprite sheet)坐标查看器。精灵表指的是...

2019-08-20 16:29:12 2269 3

原创 【基础知识】HTML5 Canvas 中canvas.width和context.canvas.width的区别和使用(参考官方文档)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy前提Javascript的代码是这个样子。var canvas = document.getElementById('ca...

2019-08-20 13:20:10 1285

原创 【基础知识】HTML5 Canvas中Canvas鼠标事件(两种方法)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy方法一可以这样做var canvas = document.getElementById('canvas'), ...

2019-08-20 13:02:22 5545

原创 【基础知识】HTML5 Canvas小项目时钟的简单实现(图文、演示)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy分析使用Canvas实现时钟,需要关注几个部件。画时钟的轮廓 画时钟上的数字 画时钟上的时针、分针、秒针 画时钟上的中...

2019-08-19 10:10:33 1279

原创 【基础知识】HTML5 Canvas 让老版本IE6、IE7、IE8支持Canvas的两种方法(链接)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy需求如果所实现的Canvas的应用程序必须支持IE6、IE7、IE8时,有两个选择。explorecanvas它可以在老...

2019-08-18 23:05:48 990

原创 【基础知识】HTML5 Canvas中save()和restore()的使用/Canvas状态的保存和恢复(应用背景)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy解释:save()和restore()时保存和恢复Canvas的状态,如画笔的颜色、宽度等等,并不包括画布上的“像素图像”,目的...

2019-08-18 22:53:28 1215

原创 【基础知识】HTML5 Canvas的绘图环境CanvasRenderingContext2D的使用(各属性简介)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy目录前言属性提示:你可以扩充2d绘图环境对象的功能前言在JavaScript代码中,很少会用到canv...

2019-08-17 11:28:35 3050

原创 【基础知识】HTML5 Canvas API的toBlob()的使用(代码示例)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudyHTMLCanvasElement.toBlob()方法创造Blob对象,用以展示canvas上的图片;这个图片文件可以被缓存或保...

2019-08-16 11:21:59 10907 1

原创 【基础知识】HTML5 Canvas API的toDataUrl()的使用(图文、演示)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy方法介绍HTMLCanvasElement.toDataURL()方法返回一个包含图片展示的 data URL。可以使用ty...

2019-08-16 10:26:04 5733 1

原创 【基础知识】HTML5 Canvas设置Canvas元素width和height的两种不同方式(图文)

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy目录设置Canvas元素width和height的两种不同方式方式1:通过CSS设置:方式2:通过canvas标签...

2019-08-07 18:05:10 4243 3

原创 【读书收获贴】HTML5 Canvas核心技术(图形、动画与游戏开发)学习贴今日开帖

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy作为一名未来想走前端的学生,比较喜欢创造“有趣的事物”,不知是一见钟情还是心心念、想好好的去学习一下canvas,暂且不谈它能给我未...

2019-08-07 17:44:32 334

原创 JavaFX、Controller、FXML之间传递变量、函数

我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。教程介绍、教程目录等能在README里查阅。传送门:https://github.com/827652549/CanvasStudy写在前面如果为了解决此问题,你有多次去使用各种方法去尝试JavaFX的加载顺序、试验自己的猜想是否正确,那么我将直接用最简洁的话...

2019-08-01 11:15:41 4239 2

精灵表动画running-sprite-sheet.png

https://blog.csdn.net/HuoYiHengYuan/article/details/99855314 《HTML5 Canvas核心技术(图形、动画与游戏开发)》精灵表坐标查看器的示例源文件

2019-08-20

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

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