《Chart Libraries Introduction》由会员分享，可在线阅读，更多相关《Chart Libraries Introduction（114页珍藏版）》请在金锄头文库上搜索。
1、HTML5 Chart Libraries Introduction,GAD JAVA Mobility Team,SVG (Scalable Vector Graphics 可缩放矢量图形)(demo)W3C标准Firefox, Safari, Opera, Chrome支持； IE9之前版本下需要插件(Adobe SVG Viewer)VML (Vector Markup Language 矢量可标记语言)(demo)仅IE支持 (5.0以上)CanvasHTML5的一部分，提供了通过 JavaScript 绘制图形的方法；Firefox, Safari, Opera, Chrome支持，
2、IE9之前的版本不支持,绘图引擎 SVG/VML/Canvas,常用的一些JavaScript框架,常用的一些JavaScript框架,http:/bbs.html5cn.org/forum.php?mod=viewthread&tid=3167&extra=http:/bbs.html5cn.org/thread-1036-1-1.html,主要Charts Library介绍,主要Charts Library介绍,ZingChart is a charting library that renders a wide arrayof charts and graphs in both Fla
3、sh and HTML5 Canvas.Website: http:/http:/ than a Dozen Chart Types 支持大量图表类型Handles Massive Data Sets (10000 points and more)支持大数据量的显示Fly thru Chart Data with Zooming, Scrolling and Filtering 支持缩放，滚动及过滤Build Interactive and Drillable Graphs 支持交互及数据钻取Live Data Feed Support to Update Charts in Realtime
4、 实时动态的更新图表,Features,ZingChart,HTML5 Canvas Charts 支持HTML5 Canvas渲染方式JSON 基于JSON格式的数据创建图表Update Graphs with Ajax支持AJAX的方式更新图表Control Charts with Full JavaScript API,Features,ZingChart,Supported Chart Types (1),ZingChart,Supported Chart Types (2),ZingChart,Advantage & Disadvantage,ZingChart,http:/ is
5、a javascript library based on the tag implemented in HTML5.Its the core visualization component of BMS systems biology platform.It works in all major browsers: Chrome, Firefox, Safari, Opera, Webkit and IE; and in all operating systems: Windows, Mac, Linux, Android, iOS, etc.Website: http:/canvasxpr
6、ess.org,Overview,canvasXpress,Support a large number of graphsSupport a few data transformations like log and exponential transformationSupport grouping of samples, hierarchical clustering, kmeans, complex layouts, regression lines, normal distribution plots, non linear fittingZooming and Panning,Fe
7、atures,canvasXpress,bar graphs,line graphs,bar-line combination graphs,boxplots,dotplots,area graphs,area-line combination graphs,stacked graphs,stacked-line combination graphs,percentage-stacked graphs,percentage-stacked-line combination graphs,heatmaps,heatmaps,2D-scatter plots,2D-scatter bubble p
8、lots,3D-scatter plots,pie charts,correlation plots,Venn diagrams,networks (or pathways),candlesticks plotsandgenome browser,Supported Graphs,canvasXpress,Advantage & Disadvantage,canvasXpress,http:/canvasxpress.org/bar.html,Demo,canvasXpress,提供常见3种图样：pie, line, barJavaScript based使用简单，功能少,简介,Jschart
9、s - http:/ Pie, bar & line，不支持其他图类无交互性生成图表为PNG图片无中文支持数字、英文、常规字符有非官方解决方案。免费非开源，商用须付费39$-169$免费版有水印,缺点,Jscharts,基于HTML5提供多种图样：Bar, pie , line, candle, bubble灵活性高图样可自定义插件可自定义开源,简介,Flotr2 - http:/ data, options)Container：DOM element；options：configuration object浏览器兼容性好绘图API使用canvas用Flashcanvas 支持IE支持移动设备
10、,特性1,Flotr2,可扩展可扩展插件可增加新的交互方式、装饰，如选择功能。Flotr.addType(typeName,typeObject)typeObject：options配置 + draw方法可定制图类图类定义：基于HTML5 canvas实现Flotr.addPlugin(pluginName,pluginObject)pluginObject：callbacks属性 + draw 方法,特性2,Flotr2,http:/ FusionChart Suite,名称FusionCharts Suite地址http:/ and PricingYou can buy the entir
11、e FusionCharts Suite, or its individual products (FusionCharts XT, FusionWidgets XT, PowerCharts and FusionMaps).,1. 概述,美观（Stunning looks）(1) 动画效果 Exciting animation for that great first impressionAll the charts in FusionCharts Suite are animated and have been known to bring the instant wow to every
12、one. Developers to management alike.,2. 特点,美观（Stunning looks）(2) 梯度美观、布局合理、设计时尚 As stunning as they can getWith the beautiful gradients, well-planned layouts and modern designs, the charts are the best looking ones you will ever see.,2. 特点,美观（Stunning looks）(3) 实用性和交互性 The charts dont just look good
13、. They feel good too.The charts are highly interactive with drill-down, tooltips, zooming, panning, chart export and visual editing. Makes for an enjoyable reporting experience.,2. 特点,美观（Stunning looks）(4) 报表可展现2D和3D效果 Charts in both 2D and 3DDepending on your users taste, you can either go glam wit
14、h 3D charts or stay simple yet elegant with the 2D charts. Or add another dimension to it with the true 3D charts.,2. 特点,美观（Stunning looks）(5) 将各种坐标的展现位置智能化 Charts with a brain of their ownThe charts automatically find out the best position for numbers, captions and labels. Even when they are very s
15、hort, very long or there are too many of them. Your charts are guaranteed to look good, every single time.,2. 特点,美观（Stunning looks）(6) 可定制化外观 Use them anywhere and everywhereCustomize the look and feel of the charts the way you want. Use them in your reports, dashboards, analytics, surveys, monitors and polls. And more.,
