GGB数学云 JavaScript:跨设备绘图的最佳选择

JavaScript:跨设备绘图的最佳选择

2015年4月12日 人阅读 Graphics»JavaScript

摘要: 分析在多种移动设备上开发矢量绘图应用可选择的编程语言、开源框架(TouchVG、Inkpad、SwiftGraphics、Raphael.js、Draw2D、JSXGraph、Sencha等)。

面临的问题

从2012年到现在,我主要使用C++开发移动终端矢量绘图应用,创作了TouchVG等约10个绘图开源项目。
基于TouchVG开发了动态几何和矢量动画等教育应用框架和程序,在国内外多个公司和学校得到应用。

主要问题是文档少、熟悉绘图框架的程序员太少,大部分都是我一个人开发,难以形成规模效应。

探索

最近一年,我在思考出路在何方、选择什么语言和框架来重新设计和优化、迎合当今教育变革、万众创新等新的发展趋势。
为试验和参与了很多开源项目,下列开源项目对我的选择影响很大:

  • Inkpad

    著名的iOS矢量插图应用,绘图性能、交互界面、矢量编辑、SVG处理等很强,用Objective-C开发。

    Inkpad

    我在汉化和改错的过程中熟悉了其架构,可以肯定的是基于Inkpad能开发出很专业的绘图应用。

    主要问题是将TouchVG和Inkpad结合存在图形结构和软件架构融合的问题、只能在iOS设备上运行。

  • SwiftGraphics

    SwiftGraphics是用Swift写的一款精心设计的矢量图形平台,可用来开发iOS平台的室内地图、GIS/CAD等绘图应用。

    我有幸加入到该项目,增加了较多功能特性。应用和分享是最好的学习方式,我基于SwiftGraphics
    开发了一个矢量动画框架 ShapeAnimation-Swift,🔥了一把😄




    我很看好SwiftGraphics,做了很多试验工作。主要问题是只能在iOS设备上运行、移植工作较大。

  • Raphael.js

    Raphael.js是一款轻量级的矢量图形框架可跨IE6等很多浏览器,基于SVG和VML,每个图形都对应一个DOM对象,可在图形上添加动画和交互事件。

    我 ,感觉使用简单、功能强大,初次体验了JavaScript的好处。略感不足是缺乏矢量图形计算和移动设备界面支持。
    另据 Web-Drawing Throwdown 一文称Raphael支持iOS但不支持Android。

  • Sencha Touch

    Sencha是由ExtJS、jQTouch 以及 Raphael 三个项目合并而成的一个开源项目,应HTML5和现代移动设备等新趋势而生。
    Sencha有较多中文资料和社区支持,商业化程度高,适合用来开发复杂的绘图应用产品。Sencha有商业授权和综合开源授权版本。

  • Draw2D touch

    Draw2D是一款JavaScript交互式绘图库,可跨多种终端设备和浏览器,提供SVG渲染和流畅的交互,可绘制类似于Visio的图形和图表、智能连线和交互元素。
    Draw2D的商业化做得很好,代码更新频繁,文档丰富,提供了GPL开源版本和商业化授权版本。

  • JSXGraph

    JSXGraph是德国拜罗伊特大学研发的跨浏览器的交互式几何、函数作图、图表、数据可视化的轻量级JavaScript框架。
    基于SVG、VML或HTML Canvas自适应渲染图形和动画,支持IE6等传统浏览器。
    支持 iOS、Android、firefoxOS、Windows 8 上的多点触摸设备。开源协议为LGPL和MIT。

    该校基于JSXGraph开发了几何画板 sketchometry,支持手势识别图形、交互式创建图形。

    其缺点是代码较复杂、主要面向几何绘图,在易理解性和文档易用性上比 Paper.js 差些。

  • Paper.js

    Paper.js是JavaScript矢量绘图的“瑞士军刀”,基于 HTML5 Canvas 和 Scriptographer(Adobe Illustrator 脚本环境)。
    能灵活创建多种矢量图形和动画,可进行交互式曲线编辑、图形选择拖放。开源协议为MIT。Paper.js 不支持IE6等老版本浏览器。

    Paper.jsScriptographer 已在科研和教学中得到应用。

总结

国内市场必须满足跨平台性和好的触摸体验,所以得忍痛舍弃基于C++的TouchVG、叫好不叫座的Swift,JavaScript成为理想选择。
随着智能手机和平板电脑的配置提升,绘图性能不再是担心的问题,如何做快做炫、赢得市场才是首要问题。

我推荐基于 Paper.jsJSXGraphSencha TouchDraw2D touch 之一开发商业级图形应用。
Sencha 和 Draw2D 虽然功能强大、支持好,但貌似巨无霸,授权协议不太开放,自己决定吧。

我个人选择基于JSXGraph开发,因为正好吻合我的需求,而且还有中小学几何教学软件在诱惑我😄

分享到: 更多