1. 首页
  2. IT资讯

前端必备知识点—Two.js

“u003Cdivu003Eu003Cpu003Eu003Cimg src=”http:u002Fu002Fp3.pstatp.comu002Flargeu002F322c000407d2f9da58b0″ img_width=”285″ img_height=”200″ alt=”前端必备知识点—Two.js” inline=”0″u003Eu003Cu002Fpu003Eu003Cpu003ETwo.js库u003Cu002Fpu003Eu003Cpu003E 基本内容u003Cu002Fpu003Eu003Cpu003E 在HTML页面中进行绘制二维图形u003Cu002Fpu003Eu003Cpu003E 支持方式u003Cu002Fpu003Eu003Cpu003E Canvas – 以图片形式出现,绘制二维图形u003Cu002Fpu003Eu003Cpu003E SVG – (默认)绘制二维图形u003Cu002Fpu003Eu003Cpu003E WebGL – 绘制三维图形u003Cu002Fpu003Eu003Cpu003E 官网地址 – http:u002Fu002Fjonobr1.github.iou002Ftwo.jsu002Fu003Cu002Fpu003Eu003Cpu003E 特点u003Cu002Fpu003Eu003Cpu003E 简单地实现矢量图及动画效果u003Cu002Fpu003Eu003Cpu003E 并不支持文字和图片u003Cu002Fpu003Eu003Cpu003E 专门提供SVG解释器u003Cu002Fpu003Eu003Cpu003E 其他2D或3D效果的动画JS库u003Cu002Fpu003Eu003Cpu003E two.jsu003Cu002Fpu003Eu003Cpu003E three.jsu003Cu002Fpu003Eu003Cpu003E 使用Two.js的步骤u003Cu002Fpu003Eu003Cpu003E HTML页面u003Cu002Fpu003Eu003Cpu003E 引入Two.js库文件u003Cu002Fpu003Eu003Cpu003E 定义容器元素(<div>)u003Cu002Fpu003Eu003Cpu003E JavaScriptu003Cu002Fpu003Eu003Cpu003E 获取页面的容器元素<div>u003Cu002Fpu003Eu003Cpu003E 创建Two.js库的对象u003Cu002Fpu003Eu003Cpu003E 将Two对象添加到页面容器中u003Cu002Fpu003Eu003Cpu003E 使用Two.js库提供的API完成需求u003Cu002Fpu003Eu003Cpu003E Two对象u003Cu002Fpu003Eu003Cpu003E 构造器 – new Two(params)u003Cu002Fpu003Eu003Cpu003E 选项u003Cu002Fpu003Eu003Cpu003E type – 创建哪种类型,默认为SVGu003Cu002Fpu003Eu003Cpu003E 默认格式为 – Two.Types.svgu003Cu002Fpu003Eu003Cpu003E Canvas格式为 – Two.Types.canvasu003Cu002Fpu003Eu003Cpu003E 绘制静态图形u003Cu002Fpu003Eu003Cpu003E 绘制直线 – makeLine(x1, y1, x2, y2)u003Cu002Fpu003Eu003Cpu003E 该方法返回Two.Line对象u003Cu002Fpu003Eu003Cpu003E 绘制矩形 – makeRectangle(x, y, width, height)u003Cu002Fpu003Eu003Cpu003E 该方法返回Two.Rectangle对象u003Cu002Fpu003Eu003Cpu003E 绘制圆形 – makeCircle(x, y, radius)u003Cu002Fpu003Eu003Cpu003E 该方法返回Two.Circle对象u003Cu002Fpu003Eu003Cpu003E 绘制椭圆 – makeEllipse(x, y, width, height)u003Cu002Fpu003Eu003Cpu003E 该方法返回Two.Ellipse对象u003Cu002Fpu003Eu003Cpu003E 绘制多边形 – makePolygon(ox, oy, r, sides)u003Cu002Fpu003Eu003Cpu003E 制作动画效果u003Cu002Fpu003Eu003Cpu003E play() – 执行循环动画u003Cu002Fpu003Eu003Cpu003E update()u003Cu002Fpu003Eu003Cpu003E Two.js的高级用法u003Cu002Fpu003Eu003Cpu003E 分组 – Two.Groupu003Cu002Fpu003Eu003Cpu003E 扩展内容u003Cu002Fpu003Eu003Cpu003E ECMAu003Cu002Fpu003Eu003Cpu003E ECMA 3u003Cu002Fpu003Eu003Cpu003E ECMA 5u003Cu002Fpu003Eu003Cpu003E ECMA 2015 – 目前最新版本u003Cu002Fpu003Eu003Cpu003E 注意u003Cu002Fpu003Eu003Cpu003E 每年都会一个新的版本u003Cu002Fpu003Eu003Cpu003E HTML5u003Cu002Fpu003Eu003Cpu003E 实时完善内容,以及增加新的内容u003Cu002Fpu003Eu003Cpu003E JS库u003Cu002Fpu003Eu003Cpu003E JS框架u003Cu002Fpu003Eu003Cu002Fdivu003E”

原文始发于:前端必备知识点—Two.js

主题测试文章,只做测试使用。发布者:℅傍ㄖ免沦陷dε鬼,转转请注明出处:http://www.cxybcw.com/11268.html

联系我们

13687733322

在线咨询:点击这里给我发消息

邮件:1877088071@qq.com

工作时间:周一至周五,9:30-18:30,节假日休息

QR code