什么是SVG? SVG 指可伸缩矢量图形 (Scalable Vector Graphics) SVG 用来定义用于网络的基于矢量的图形 SVG 使用 XML 格式定义图形 SVG 图像在放大或改变尺寸的情况下其图形质量不会有所损失 SVG 是万维网联盟的标准 SVG 与诸如 DOM 和 XSL 之类的 W3C 标准是一个整体 简介: SVG.js是一个轻量级的JavaScript库,允许你轻松操作SVG和定义动画. SVG(Scalable Vector Graphics,可缩放矢量图形)是基…

一.canvas简介 1.1 什么是canvas?(了解) 是HTML5提供的一种新标签 <canvas></canvas> 英 ['kænvəs] 美 ['kænvəs] 帆布 画布 Canvas是一个矩形区域的画布,可以用JavaScript在上面绘画.控制其每一个像素. canvas 标签使用 JavaScript 在网页上绘制图像,本身不具备绘图功能. canvas 拥有多种绘制路径.矩形.圆形.字符以及添加图像的方法. HTML5之前的web页面只能用一些固定样式的标签:…

  名词解解释 adobe After Effects AE:adobe After Effects,adobe公司的专业视频制作软件. Bodymovin插件预览 Bodymovin:是一个AE的插件,它可以把动画直接输出成代码,直接给程序员使用放在各个终端上使用,是airbnb团队开发的一个插件,其原理是将动画转成json文件格式,然后通过JS程序输出,转换成svg.canvas或html5动画. Lottie官网界面 Lottie:是集成BodyMovin一系列服务的总称,其官网是http…

1.VML: VML的全称是Vector Markup Language(矢量可标记语言),矢量的图形,意味着图形可以任意放大缩小而不损失图形的质量,这在制作地图上有很大用途,VML只是被IE支持. 2.SVG:       可缩放矢量图形(Scalable Vector Graphics,SVG)是基于可扩展标记语言(XML),用于描述二维矢量图形的一种图形格式.SVG由W3C制定,是一个开放标准.       由于SVG文件可嵌入JavaScript(严格地说,应该是ECMAScript)脚…

1.VML: VML的全称是Vector Markup Language(矢量可标记语言),矢量的图形,意味着图形可以任意放大缩小而不损失图形的质量,这在制作地图上有很大用途,VML只是被IE支持. 2.SVG:       可缩放矢量图形(Scalable Vector Graphics,SVG)是基于可扩展标记语言(XML),用于描述二维矢量图形的一种图形格式.SVG由W3C制定,是一个开放标准.       由于SVG文件可嵌入JavaScript(严格地说,应该是ECMAScript)脚…

1.借鉴自: http://www.codefans.net/soft/3061.shtml 来源于网上. flowchart.js  http://adrai.github.io/flowchart.js/ , 基于SVG创建Flow Chart go.js http://www.gojs.net/latest/index.html  go.js 提供一整套的JS工具 ,支持各种交互式图表的创建.有免费版和收费版 joint.js http://www.jointjs.com/ joint.j…

1.华丽的HTML5图表 可展示实时数据 HTML5在图表应用中也十分广泛,比起以前的网页图表,HTML5图表制作更便捷,功能更强大.这款HTML5图表插件外观十分华丽和专业,在数据展示方面也很有优势,图表不仅支持多维数据展示,而且支持区域选择数据功能,利用该HTML5图表可以更加方便地管理你的数据. 在线演示 源码下载 2.HTML5折线图表Aristochart 图表配置简单 利用这些HTML5图表可以很方便的展示各种数据,而且非常直观.今天要向大家分享一款HTML5折线图表插件Aristo…

<canvas>元素主要用来图形的绘制,通过脚本来完成(通常时js来实现): 可以利用其实现图表,游戏等项目的开发. getContext 获取画布的摸板是2d还是3d strokeRect(x,y,w,h); 四个参数: x轴,y轴,宽度,高度 主要用来设置边框,可以理解为border fillRect(x,y,w,h); 四个参数:x轴,y轴,宽度,高度 主要用来设置内容盒子,可以理解为div 注: canvas是h5新增标签,兼容性问题可以卸载canvas标签中来进行处理, 宽度和高度的…

[转载]原文地址:http://www.cnblogs.com/webgis8/articles/1516639.html 因为Google Map项目的需要,最近一直在寻求相关的Javascript图形库,在尝试用Google Map API提供的javascript接口绘图时发现其效果和效率都不太理想,同时也用过jsgraphics库,也不是很好.又在网上找到了下面几个. mxGraph mxGraph是一款基于web的绘制流程图的javascript库工具,虽然目前还尚未提供注册,不过好在…

简介 贝塞尔曲线是可以做出很多复杂的效果来的,比如弹跳球的复杂动画效果,首先加速下降,停止,然后弹起时逐渐减速的效果. 使用贝塞尔曲线常用的两个网址如下: 缓动函数:http://www.xuanfengge.com/easeing/easeing/ cubic-bezier:http://cubic-bezier.com/ 如何用贝塞尔曲线画曲线 一个标准的3次贝塞尔曲线需要4个点:起始点.终止点(也称锚点)以及两个相互分离的中间点. 无论SVG, Canvas还是CSS3动画,都牵扯到这4个…