canvas

绘制2D位图。

Echarts是基于Canvas技术的可视化工具，底层封装了原生的JavaScript的绘图 API。

canvas里面绘制的图形不能被引擎抓取，canvas中我们绘制图形通常是通过javascript来实现。

svg

绘制2D矢量图。

svg里面的图形可以被引擎抓取，支持事件的绑定，svg更多的是通过标签来实现。

webgl

用3D画位图的api。

threejs

基于webgl的3D场景库

d3js

数据可视化工具，只支持svg

canvas svg webgl threejs d3js 的区别的更多相关文章

  1. 八大疯狂的HTML5 Canvas及WebGL动画效果——8 CRAZY ANIMATIONS WITH WEBGL AND HTML5 CANVAS【收藏】

    HTML5, WebGL and Javascript have changed the way animation used to be. Past few years, we can only a ...

  2. Canvas & SVG

    Canvas & SVG https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-dev ...

  3. CSS3、SVG、Canvas、WebGL动画精选整理

    一.CSS3动画 名称 用途 链接 阴影波纹特效 1.元素hover效果 2.突出表现效果 http://www.jq22.com/code80 横板导航菜单动画 导航菜单 http://www.jq ...

  4. 【JavaScript】SVG vs Canvas vs WebGL

    参考资料: http://blog.csdn.net/lufy_legend/article/details/38292125 http://zhidao.baidu.com/link?url=e4n ...

  5. 通过实例深入理解HTML5/CSS3/SVG/WebGL的技术本质

    常常听到人们对于HTML5的讨论,看了页面头部这个那个就是Html5,误认为HTML5只是新增些标签“而已”,学完了W3School似乎就理解了.实际上很多从业人员并没有深入理解业界为什么要推出HTM ...

  6. 移动网站中，用canvas,svg比用图片好？

    1.Svg可以单独作为文件打开,在AI里做矢量图形,保存图层路径,即可另存为Svg文件. (1) Path语法:命令+参数.大写字母表示坐标参数为绝对位置,小写字母表示坐标参数为相对位置(即上次画笔结 ...

  7. 基于WebGL/Threejs技术的BIM模型轻量化之图元合并

    伴随着互联网的发展,从桌面端走向Web端.移动端必然的趋势.互联网技术的兴起极大地改变了我们的娱乐.生活和生产方式.尤其是HTML5/WebGL技术的发展更是在各个行业内引起颠覆性的变化.随着WebG ...

  8. H5新特性——--第三方绘图工具库 echarts(canvas)---SVG绘图

    今天学习的内容 3.1:h5新特性---第三方绘图工具库 echarts(canvas) 百度 echarts;d3;two.js;.... 3.2:h5新特性---SVG绘图 3.2:h5新特性-- ...

  9. canvas与webgl坐标转换

    1 canvas的坐标系 坐标原点在左上角,横轴向右为X轴正方向,竖直向下为Y轴正方向 2 webgl的坐标系 坐标原点在绘图区域的中心点,横向右为X轴正方向,竖直向上为Y轴正方向,横纵坐标区域范围为 ...

随机推荐

  1. UESTC1013-我的魔法栈-模拟/排列组合

    有一个串,有黑色和白色两种元素.一次操作可以把最上面的白色元素变成黑色,同时把这个元素上面的所有元素变成白色. 给你一个30以内的串,计算变成全黑时,元素变化的总和. 我用的方法比较笨,打表处理了1- ...

  2. HDU1659-GCD-容斥原理

    从1-a和1-b种选两个数xy,计算出令gcd(x,y)=k的xy的对数. 对于每一个i∈[1,b]使用solve(i,n)函数解决有几个j∈[1,n]使gcd(x,y)=k.然后累加solve(i, ...

  3. [SP1043] GSS1 - Can you answer these queries I

    传送门:>Here< 题意:求区间最大子段和 $N \leq 50000$ 包括多组询问(不需要支持修改) 解题思路 线段树的一道好题 我们可以考虑,如果一组数据全部都是正数,那么问题等同 ...

  4. Tournament ZOJ - 4063 （青岛区域赛 F 打表）

    打表题.. 规律是找出来了 奈何优化不了 .... #include <iostream> #include <cstdio> #include <sstream> ...

  5. Ionic生命周期与注意点

    需要注意的地方是:在走页面的生命周期以前,会先走构造方法 构造方法只走一次,除非再次创建这个页面.所以如果先push了一个新页面,然后再调用pop()返回到之前的页面,那么是不会走构造方法里面的方法的 ...

  6. MT【263】待定系数

    已知$a,b>0$且$ab(a+b)=4$,求$2a+b$的最小值_____ 解答:$\sqrt{3}(2a+b)\ge(\sqrt{3}+1)a+b+(\sqrt{3}-1)(a+b)\ge3 ...

  7. web前端监控的三个方面探讨

    一. js错误监控方式 1. 主动判断 我们在一些运算之后,得到一个期望的结果,然而结果不是我们想要的 // test.js function calc(){ // code... return va ...

  8. ACM中的fread读入

    fread可以加快读入速度,尤其是读特大的二进制文件. #include <cctype> typedef long long LL; char buf[100000],*p1=buf,* ...

  9. 面试---Python中的模块和包是什么？

    python模块是: 自我包含并且有组织的代码片段为模块. 表现形式为:写的代码保存为文件.这个文件就是一个模块.sample.py 其中文件名smaple为模块名字. python包是: 包是一个有 ...

  10. post提交的数据几种编码格式

    1.背景介绍 HTTP/1.1 协议规定的 HTTP 请求方法有 OPTIONS.GET.HEAD.POST.PUT.DELETE.TRACE.CONNECT 这几种.其中 POST 一般用来向服务端 ...