JavaScript图形库

做前端少不了画图,html5 的 canva 很强大,可是如果所有需求都自己画图,恐怕会被 leader 炒掉。记录一下我用过的几个 2D 和 3D 的js图形库,各种功能。我就不分 2D 和 3D 了,因为 WebGL前端数据可视化是一个很热门的方向,发展趋势,也是很多图形库的发展目标。

1.echarts:百度开源的功能很多的图形库。看一下下图的 demo 就知道它的功能了。http://echarts.baidu.com/examples.html 。可以满足基本的二维数据图表的绘制,简单方便。

2.echarts-gl:百度开源的功能很多的GL(3D)图形库。下图的 demo。http://echarts.baidu.com/examples.html 。可以满足基本的二维数据图表的绘制,简单方便。http://gallery.echartsjs.com/explore.html#tags=echarts-gl~sort=rank~timeframe=all~author=all 。画地球仪、3D 百度地图什么的,很好用。还可以结合 Web AudioContext ,结合音频数据,做出很炫酷的效果。

3.threejs :一个开源的web 3D 工具,还开源了 threejs editor ,是个简化版的建模工具。threejs 示例 https://threejs.org/ ,threejs editor 示例:http://mrdoob.com/

还可以模拟分子模型,当然,你能想到的 3D 模型,threejs 几乎都能做到。但是 threejs 的交互功能并不是很完善。

4.D3.jshttps://d3js.org/,更倾向于二位数据图表的绘制,是一个很强大的用户自定义结构的工具。

5.mapbox.js,可以创建各种自定义地图,二维的世界地图、各省市地图都可以绘制成功。https://www.mapbox.com/maps/

6.mapbox-gl.js,就是 3D 的地图绘制,数据和行为之间的交互做的很好,其实 echarts-gl 和.mapbox-gl 结合可以做出更炫酷的效果,详情见:.http://gallery.echartsjs.com/editor.html?c=xrJHCfsfE-  。

7. cytoscape.js   http://js.cytoscape.org/ ,很适合绘制二维的社交节点关系图、神经网络节点关系图,反正涉及到节点的图表都可以试试这个图形库,当然这库还有其他的优点哈,比如图中各节点的动态交互就做的很棒棒。

8.amcharts,一个部分开源的工具,可以绘制二维的折线图、柱状图、饼图、地图、股票趋势图、仪表图等,当然还可以绘制三维的饼图、柱状图等。但是非开源,图标上方会有水印,工具好用。https://www.amcharts.com/demos/

9.highcharts,功能很多,满足基本的数据展示需求,国内用的很多。

10.GraphicsJS : http://www.graphicsjs.org/  ,就不多说了,可以自己看官网了解。

11.阿里的G2可以让用户通过简单的语法搭建出无数种图表,并且集成了大量的统计工具,支持多种坐标系绘制,可以让用户自由得定制图表,是为大数据时代而准备的强大的可视化工具。也可以看看阿里的DataV数据可视化,貌似是付费的。

12.raphael.js  : https://dmitrybaranovskiy.github.io/raphael/

13.BabylonJS:微软加的 3D 图形引擎工具,不过是typescript 写的,很好用。建模效果很逼真。http://www.babylonjs.com/

14.Stardusthttps://stardustjs.github.io/,基于CPU的可视化图形库。

15.其他库:okaycharts、fusioncharts、xCharts、Flotr、RGraph、ichartjs、ChartJS、rickshaw、jqplot、rgraph、digraphs、canvasxpress、graphael、 Awesome Chart JS ,大家可以看看这篇:http://blog.csdn.net/github_36111469/article/details/53345664  当然,这些其他库我还没用过。

时间: 2024-10-14 21:09:56

JavaScript图形库的相关文章

【 随笔 】 JavaScript 图形库的流行度调查

2014年可以说是 JavaScript 最风光的一年,成为上升最快的语言,在 Github 上最受关注的前10个仓库中,有7个是基于 JavaScript 开发的,数不胜数的函数库可适应于各种需求.那么,在可视化图形库方面,最受关注的有哪些呢? 1. 编程语言排行榜 数据来源于 TIOBE,前六名是我们都耳熟能详的语言:C.Java.C++.PHP等,JavaScript排名第 7,上升率最大.排在之后的语言,一眼看过去,非神者恐怕会有些不认识. 2. 图形库的流行度 统计使用的是 Googl

[转载]几个开源Javascript图形库

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

javascript开源大全

javascript开源大全 Ajax框架-jQuery 可视化HTML编辑器-CKEditor 国产jQuery-UI框架-(jUI)-DWZ 网页开发FireFox插件-Firebug 服务器端的JavaScript脚本-Node.js jQuery图表插件-jQchart HTML5-开发框架-jQuery-Mobile 跨浏览器的RIA框架-ExtJS Flash视频播放器-JW-PLAYER jQuery表单插件-jQuery.form jQuery-File-Upload 可视化HT

给开发者提供的 35 款 JavaScript 图形图表库

给开发者提供的 35 款 JavaScript 图形图表库 图表是数据图形化的表示,也就是“通过形象的图表来展示数据,比如条形图,折线图,饼图”.几乎每个开发或者项目管理团队都需要图表或者图形来简化 理解,可视化复杂的数据和 web 应用工作流.可视化图表可以帮助开发者更容易理解复杂d数据,提高生产的效率和 web 应用和项目的可靠性. JavaScript 图表和图形库就是一个简单创建图表和图形的工具.现在互联网上有许多五花八门的 JavaScript 图表和图形库,帮助开发者们更好的创建 w

Javascript 在线文档

http://jquery.com/    jQuery http://jqueryui.com/  jQuery UI http://plugins.jquery.com/caret/    输入框文字选择与光标位置处理 http://www.examplet.org/jquery/caret.php  示例代码 http://requirejs.org      require.js http://angularjs.org/   Google 推出的SPA( single-page-app

数据可视化-gojs插件使用技巧总结

随着云计算时代的到来,由于Web技术的快速革新以及为了提供高质量的用户体验,数据可视化成为了前端技术发展的一大方向.为了解决这个问题,现如今涌现了很多优秀的第三方的javascript图形库,比如highcharts.js,echarts.js,d3.js,go.js- 数据可视化javascript插件对比 在HTML5标准支持下,web实现图形标准主要分为canvas和svg,上述的javascript图形库都是依赖2者之一作为底层库.Canvas基于像素,提供2D绘制函数,是一种HTML标

【 D3.js 入门系列 — 0 】 简介和安装

[ D3.js 入门系列 — 0 ] 简介和安装 发表于2014/06/12 近年来,可视化越来越流行,许多报刊杂志.门户网站.新闻.媒体都大量使用可视化技术,使得复杂的数据和文字变得十分容易理解,有一句谚语“一张图片价值于一千个字”,的确是名副其实.各种数据可视化工具也如井喷式地发展,D3 正是其中的佼佼者. 1. D3 是什么 D3 的全称是(Data-Driven Documents),顾名思义可以知道是一个被数据驱动的文档.听名字有点抽象,说简单一点,其实就是一个 JavaScript

【 随笔 】 D3 难吗?

有不少朋友说学 D3 挺难的.为什么呢?想写一篇文章分析分析. 1. D3 出现的背景 D3.js 是 Github 上的一个开源项目,用于数据可视化.作者是 Mike Bostock,纽约时报的工程师.现纽约时报上各种数据新闻的可视化图表,都是基于 D3 制作的. 数据新闻,是近年来十分热门的一个行业,在互联网新闻里,添加上生动的数据分析,以图形的形式展示,简单易懂. 数据新闻是随着大数据时代的潮流而出现.各公司和机构能掌握的数据越来越多,例如谷歌掌握了数以千万亿的搜索数据,沃尔玛掌握了全球的

大数据可视化分析工具推荐

各个互联网公司通过大量的用户数据.信息进行统计分析,而这些大量繁杂的数据在经过可视化工具处理后,就能以图形化的形式展现在用户面前,清晰直观.随着各种数据的增加,这种可视化工具越来越得到开发者们的欢迎. 下面推荐25款可视化工具供大家选择和使用. 1.Modest Maps Modest Maps是一个轻量级.可扩展的.可定制的和免费的地图显示类库,这个类库能帮助开发人员在他们自己的项目里能够与地图进行交互.ModestMaps提供一个核心健壮的带有很多hooks与附加functionality函