资源: 图片,图表,图标插件

图标:
15套华丽的的扁平设计风格的图标 http://www.cnblogs.com/lhb25/p/15-gorgeous-sets-flat-designed-icons.html


程序员给女朋友用HTML5制作的3D相册 http://www.webhek.com/misc/3d-album



电子 电路模拟 CircuitJS1 http://www.oschina.net/p/circuitjs1
reveal.js H5幻灯片 ppt效果 Demo: https://github.com/hakimel/reveal.js/wiki/Example-Presentations
Round Slider 是 jQuery 插件,允许用户选择一个值或者一个范围的值。不仅仅是个圆形滑块,还支持半圆形,饼形。 http://www.oschina.net/p/roundslider
grafi.js 是一个 JavaScript 图形处理库  http://grafijs.org/



画廊 , 幻灯片
Rondell画廊 http://projects.sebastianhelzle.net/jquery.rondell/
jcarousel画廊 http://sorgalla.com/jcarousel/
fotorama画廊 http://fotorama.io/
jquery图片幻灯片,Jquery特效 http://www.iteye.com/topic/1132110
30个精美的jQuery幻灯片效果插件和教程 http://www.cnblogs.com/lhb25/archive/2011/08/18/stunning-jquery-slider-plugins-and-tutorials.html
10个精选 jQuery 幻灯片插件 http://www.siqiboke.com/post/492.html
SLF一个很不错的画廊 http://darsa.in/sly/#!examples
满屏画廊: http://buildinternet.com/project/supersized/
marquee.js - jQuery 多功能 无缝滚动插件 http://wange.im/demo/marquee-slide/marquee_slide.html
jQuery幻灯片插件 Smoothslides 图片可移动,并且可设置移动的方向 http://www.dowebok.com/demo/187/
jQuery 图片插件 Viewer-jQuery 简单的图像插件。 特点: 触控支持 缩放 旋转 翻转 键盘支持 跨浏览器支持  http://www.oschina.net/p/viewer-jquery
使用AD Gallery制作强大的相册画廊 http://www.helloweba.com/view-blog-61.html
jquery图片滚动特效banner http://www.17sucai.com/pins/demoshow/349
自动播放 http://bxslider.com/examples
jquery幻灯片插件slidr.js http://www.jq22.com/jquery-info430
jQuery和CSS3炫酷 3D旋转画廊特效插件  http://www.jq22.com/jquery-info2095
非常全面新的jQuery图片画廊和滑块 http://www.open-open.com/news/view/1cb0eb2
上下滑动轮播幻灯片特效代码,支持自动满屏显示,带有上下箭头控制条 http://js.itobe.cn/contents/t/02/20140105153458/info.htm demo: http://js.itobe.cn/contents/t/02/20140105153458/view/demo.htm
超酷炫的jQuery焦点幻灯片特效代码 http://js.itobe.cn/contents/t/02/20140105171822/info.htm demo : http://js.itobe.cn/contents/t/02/20140105171822/view/demo.htm
jQuery和CSS3炫酷全屏垂直滚动切换幻灯片 http://www.htmleaf.com/jQuery/Slideshow-Scroller/201506102009.html demo: http://www.htmleaf.com/Demo/201506102010.html
JQUERY BANNER焦点图片切换图片上下翻滚、图 http://www.17sucai.com/pins/demoshow/349
pageSwitch.js插件实现 图片翻转切换效果 http://www.lanrenzhijia.com/js/css3/3116.html, Demo: http://demo.lanrenzhijia.com/2015/pageSwitch0707/
TouchSlider.js则侧重于在滑动效果下,不仅支持全屏切换,还支持不固定尺寸的幻灯切换 http://u.boy.im/touchslider/
jQuery cxScroll 间歇式无缝滚动 http://code.ciaoca.com/jquery/cxScroll/demo/
照片墙 https://github.com/oriongunning/gridder
Swiper 触摸画廊 http://idangero.us/swiper/
简约的 轮播组件 Lory http://www.oschina.net/p/lory
jQuery 轮播图插件 Unslider.js 仅有3KB大小 http://www.bootcss.com/p/unslider/
FlexImages 是一款轻量级的 JavaScript 画廊插件 http://www.oschina.net/p/fleximages





30 个最棒的 jQuery 的拖放插件,包括门户,布局,orgChart组织部门图,Nestable等功能 http://www.oschina.net/news/58038/jquery-drag-and-drop-plugins
7种鼠标悬停效果,多样的图片说明展示 http://tympanus.net/Tutorials/CaptionHoverEffects/CaptionHoverEffects.zip Demo: http://www.yyyweb.com/demo/inner-show/caption-hover.html
惊艳视差滚动效果的 jQuery 插件 http://www.cnblogs.com/lhb25/archive/2012/09/13/jquery-parallax-and-scrolling-effect-plugins.html
推荐15款创建漂亮幻灯片的 jQuery 插件 http://www.cnblogs.com/lhb25/p/15-jquery-slideshow-plugins.html
为应用程序设计的 10 个超酷的图标集 http://www.oschina.net/news/54982/10-cool-icon-sets-for-app-design





仪表盘
meter gauge, jqplot插件 http://www.jqplot.com/deploy/dist/examples/meterGauge.html
gauge-meter.js http://codecanyon.net/item/gauge-meter/full_screen_preview/4907507
18个有用的图标插件 http://freebiesdesign.com/18-useful-jquery-charts-plugins/
hcharts的仪表盘例子 http://www.hcharts.cn/demo/index.php?p=59,参数说明: http://blog.csdn.net/javaliuzhiyue/article/details/9943751
JustGage简单好看仪表盘  http://www.justgage.com/,文档: http://blog.csdn.net/craryprimitiveman/article/details/22166557
Gauge.js http://bernii.github.io/gauge.js/
jsgauges http://codecanyon.net/item/jsgauges/982713?ref=telyva
JustGage 是一个 JavaScript 插件来生成很漂亮的仪表盘  http://www.justgage.com/
d3扩展gauge 1. http://bl.ocks.org/msqr/3202712, 2. http://jsfiddle.net/mr23/vJuNU/, 3. http://codepen.io/jaketrent/pen/eloGk
网页饼图组件 easyPieChart http://www.oschina.net/p/easypiechart



图片文本滚动
12款很好用的 jQuery 图片滚动插件 http://www.cnblogs.com/lhb25/p/jquery-image-slider-plugins.html
jQuery+CSS实现的 图片滚动效果 http://www.helloweba.com/view-blog-139.html
不间断滚动jquery特效不停从右往左滚动图片特效 http://www.divcss5.com/css-texiao/texiao656.shtml
万能滚动插件(包含文字滚动、图片上下滚动、图片左右滚动、图片渐隐渐现滚动、图片消失与出现滚动等)  https://github.com/kujian/power-slider
jquery 图片滚动xslider 插件图片左右滚动、上下滚动 http://sandbox.runjs.cn/show/ek2be6kx
带左右控制按钮的图片滚动 http://www.html5cn.org/article-5120-1.html
14个jQuery Carousel特效插件 http://www.solagirl.net/jquery-carousel-plugins.html
jQuery图片文本滚动切换插件 jCarousel http://www.zhangxinxu.com/wordpress/2009/12/jquery%E5%9B%BE%E7%89%87%E6%96%87%E6%9C%AC%E6%BB%9A%E5%8A%A8%E5%88%87%E6%8D%A2%E6%8F%92%E4%BB%B6jcarousel%E4%B8%AD%E6%96%87%E7%BF%BB%E8%AF%91%E4%B8%8E%E8%AF%A6%E8%A7%A3/
jMyCarousel 图片滚动 http://www.enova-tech.net/jmycarousel
jQuery 图片切换插件jquery.cycle.js  http://jquery.malsup.com/cycle/, 一个教程: http://blog.csdn.net/itmyhome1990/article/details/30480141
jQuery power-slider 全能 图片文本滚动插件 http://caibaojian.com/power-slider, Demo : http://caibaojian.com/demo/power-slider/index.html
textSlider 文字滚动插件 http://www.css88.com/demo/textSlider/textSlider.html






思维导图jquery插件
JS思维导图类库 jsMind http://www.oschina.net/p/jsmind
在线脑图编辑器 Kity Minder http://www.oschina.net/p/kityminder
思维导图工具 my-mind http://www.oschina.net/p/my-mind


绘制UML图的JS库 jsUML2 http://www.uco.es/users/in1rosaj/tools/jsUML2/editor/index.html
图片格式转换 Img2css http://www.oschina.net/p/img2css





图表
14种流行的基于JavaScript的数据可视化工具 http://my.oschina.net/pydevops/blog/675941
推荐 14 款基于 JavaScript 的数据可视化工具  http://www.oschina.net/news/69431/14-popular-data-visualization-tools
20 个最棒的 JavaScript 图表库 http://www.oschina.net/translate/20-best-javascript-chart-libraries
Google Charts谷歌图表 https://developers.google.com/chart/interactive/docs/examples
js画图的库,还是joint.js合适一些,对于简单的图显示很适用。具体链接: http://www.daviddurman.com/automatic-graph-layout-with-jointjs-and-dagre.html
拓补图编辑器 Graph.Editor http://www.oschina.net/p/graph.editor
jQuery图表(jqPlot,Highcharts) http://liuzidong.iteye.com/blog/1534360
几款实用的 JavaScript 图形图表库 http://www.cnblogs.com/lhb25/p/6-libraries-for-visualized-charts-graphs.html
jQuery Visualize Plugin http://www.filamentgroup.com/examples/charting_v2/index_2.php,浏览器支持:IE6,7,8, Firefox 2, firefox 3.5, Safari 3, 4, Opera 9.
HTML5 canvas在IE中不支持但是 Google维护了一个类库能将Canvas翻译成VML,这样可以允许在任意版本IE中运行
jQuery Sparklines 动态图表 http://omnipotent.net/jquery.sparkline/#s-about
JavaScript图表Highcharts http://www.highcharts.com/, 中文网 http://www.hcharts.cn/, 演示 http://www.hcharts.cn/demo/index.php
在线进度条: http://preloaders.net/
用于构建交互式图表的最佳 jQuery 图表库 http://www.oschina.net/translate/best-jquery-chart-libraries-for-building-interactive-charts
5个最顶级jQuery图表类库插件 http://www.gbtags.com/technology/jquery/jquerytop5charting/
10 个 jQuery 图表插件推荐 http://blog.jobbole.com/21136/
jsPlumb jQuery插件 jsPlumb这个jQuery插件为开发者提供了一种可视化连接网页元素的方法 http://jsplumbtoolkit.com/demo/home/dom.html
     jsPlumb开发入门教程(实现html5拖拽连线) http://blog.csdn.net/zhaoxy_thu/article/details/9532143
     Jquery+jsPlumb流程图实现      http://hi.baidu.com/dlbup/item/125f24c982e61878ced4f802,
     使用jsPlumb制作流程图设计器 http://www.cnblogs.com/lwme/p/use-jsplumb-make-flowChart-designer.html
     使用 JsPlumb 绘制拓扑图的通用方法 http://blog.csdn.net/lovesqcc/article/details/14003987
BPMN 2.0 渲染工具包 bpmn-js 制作流程图 http://www.oschina.net/p/bpmn-js
Echarts动态加载图表数据 http://www.iteye.com/topic/1134808

ECharts 开源来自百度商业前端数据可视化团队,基于html5 Canvas,是一个纯Javascript图表库, http://echarts.baidu.com/doc/example.html
国人开发OrgChart 是一个基于纯DOM与CSS3的 组织结构图插件 http://www.oschina.net/p/orgchart
jOrgChart组织部门图 https://github.com/wesnolte/jOrgChart, 实现例子: http://blog.csdn.net/linruonan90/article/details/38666283
jquery-orgchart组织部门图 https://github.com/caprica/jquery-orgchart
支持编辑的Org组织架构jOrgChart Demo http://runjs.cn/detail/jwe6ccoj
Org展示组织机构的树形组件 http://www.douban.com/note/301315901/
html5绘制 组织架构图表代码 http://www.17sucai.com/pins/demoshow/16127
D3 http://d3js.org/,官网有例子, 中文介绍: https://github.com/mbostock/d3/wiki/CN-Home, 教程: http://www.pkuwwt.tk/d3-tutorial-cn/fundamentals.html 其他例子 http://dimplejs.org/examples_index.html
NVD3.js, 基于D3扩展 http://www.oschina.net/p/nvd3js 例子 http://nvd3.org/examples/ 是一个基于D3.js的开源图表JavasScript 类库,它可生成具有交互性的图表,定制性也非常高。它可用于绘制线性图、柱状图、饼图等多种常见的图表类型。它的使用方法也非常简单,如果你正好用过 D3.js,上手是相当容易的。
C3.js 0.4.8, 基于D3扩展 发布,开源图表库 http://www.oschina.net/news/57917/c3-js-0-4-8, 例子: http://c3js.org/examples.html
流程图前端展示控件 d3-process-map http://www.oschina.net/p/d3-process-map
xCharts 是一个使用 D3.js 来构建漂亮的可定制的数据驱动的 JavaScript 图表库 http://tenxer.github.io/xcharts/examples/
可视化库 Vis.js http://www.oschina.net/p/visjs
Chartist.js 是 简单的响应式图表 http://www.oschina.net/p/chartist-js
Epoch 是一个通用的 实时的图表http://fastly.github.io/epoch/
国人开发的图表库 ACharts,非常优秀 http://acharts.github.io/, 文档: http://spmjs.io/docs/acharts/wiki/04-series.html,坐标轴基类 https://github.com/acharts/achart-axis/blob/master/wiki/1-base.md
js charts 很不错 http://www.jscharts.com/
jQuery Visualize Plugin 是一个 根据表格的内容自动生成图表的 jQuery 插件 http://www.oschina.net/p/jquery+visualize+plugin
使用Raw你可以在数分钟内就轻松完成一些 高级数据可视化工作 http://www.oschina.net/p/raw
Protovis 是一个 可视化 javaScript 图表生成工具  http://www.oschina.net/p/protovis
rossfilter 是一个用来展示 大数据集的 JavaScript 库,支持超快的交互 http://www.oschina.net/p/crossfilter
Dracula 是用一系列的工具来显示和布局互动图表,包括各种相关的算法, 图形跟图形关联 http://www.graphdracula.net/
图像图标库 Yako.js http://www.oschina.net/p/yako-js
国人开发拓扑图展示工具 ctopo  http://www.oschina.net/p/ctopo
圆形进度条 jQuery 插件 CircularLoader.js http://www.oschina.net/p/circularloader-js
圆形进度条 ProgressPieSVG http://www.oschina.net/p/progresspiesvg
SVG Drawing Animation - SVG 绘制动画 http://www.cnblogs.com/lhb25/p/svg-drawing-animation.html
MetricsGraphics.js 是一个可视化数据图表库,可在网页上呈现时间序列数据。它很小,60kb之内,但它提供了一个简便方法来产生图像常见类型。当前这个库支持折线图、散列图、直方图、条形图、图表、甚至是基本的线性回归。 http://www.oschina.net/p/metrics-graphics
开发者用了都说好的5款JavaScript图表库 http://my.oschina.net/sqzy/blog/473479
jqPlot 优秀的图表插件 在jqPlot图表插件使用说明(一) http://blog.csdn.net/tang19880721/article/details/33725743 jqPlot图表插件使用说明(二) http://my.oschina.net/treenewbee/blog/489968
流程图插件 Flowchart.js http://www.oschina.net/p/flowchart-js
JavaScript 图像库 plotly.js http://www.oschina.net/p/plotly-js
鱼骨图: http://bl.ocks.org/bollwyvl/9239214#d3.fishbone.js
Javascript 生成 流程图 dagre-d3  http://www.bkjia.com/webzh/1039967.html
web 流程图JS插件:dagre-d3 http://blog.csdn.net/inuyasha1121/article/details/49095991
拖拽绘制流程图 workflowcanvas dagre.js 提供 可以实现拖拽绘制流程图  http://www.oschina.net/p/workflowcanvas
数据探查与可视化平台Caravel http://www.ctocio.com/ccnews/20665.html
Qunee for HTML5 - 开发清新、高效的拓扑图组件  http://qunee.com/
强大的JavaScript 响应式图表Chartist.js http://www.codeceo.com/article/chartist-js.html





甘特图
taitems/jQuery.Gantt 甘特图 http://taitems.github.io/jQuery.Gantt/, 下载: https://github.com/taitems/jQuery.Gantt
robicch/jQueryGantt https://github.com/robicch/jQueryGantt
采用纯Html/Javascript实现的几个甘特图  http://www.open-open.com/home/space-668-do-blog-id-787.html
Dashboards by Keen IO
10 jQuery Gantt Chart Tools 10甘特图 http://pulse2.com/r/jquery-gantt-chart/
http://www.cnblogs.com/lhb25/p/responsive-dashboard-templates-bootstrap.html
Gantt 编辑器 jQueryGantt http://www.oschina.net/p/jquerygantt


其他:
css3鼠标划过图片散开特效 http://www.phplearn.cn/dshare/info_1837.html
CSS 动画图标集 hamburgers https://jonsuh.com/hamburgers/
旋转插件jQueryRotate: http://jqueryrotate.com/, 一些中文说明: http://www.css88.com/archives/4519, http://www.dowebok.com/72.html

猜你喜欢

转载自panyongzheng.iteye.com/blog/2271981
今日推荐