简体繁体 English

计算几何Javascript

[英]Computational Geometry Javascript

原文 2012-03-14 07:50:44 7 4 javascript/ html5/ geometry/ html5-canvas/ computational-geometry

I´m thinking on coding a couple of examples for my Computational Geometry class (2D), I want to use html5 and javascript. 我正在考虑为我的Computational Geometry类（2D）编写几个例子，我想使用html5和javascript。

Can anyone recommend a javascript library or does html5 has everything I need to start? 任何人都可以推荐一个JavaScript库或html5有我需要启动的一切吗？

I will be mostly working with points and lines, but it would be nice to have something that draws a Cartesian plane as a reference and maybe some data structures ready to use. 我将主要使用点和线，但是有一些东西可以绘制笛卡尔平面作为参考，也许可以使用一些数据结构。

4 个解决方案

JSXGraph JSXGraph

Specifically focuses on dynamic geometry and functions visualization. 特别关注动态几何和功能可视化。 Comes from the academia. 来自学术界。 Authors – a German university. 作者 - 德国大学。

Uses SVG (with fallback to Canvas and VML for IE). 使用SVG（回退到Canvas和VML for IE）。 Works on iOS and Android. 适用于iOS和Android。

The API is a very abstracted SVG API. API是一个非常抽象的SVG API。 It operates on figures and groups of figures, tangents, hyperbolae &c. 它根据数字和数字组，切线，双曲线和c进行操作。

Has nice documentation . 有很好的文档。

SVG is not considered part of HTML5, but it's worth looking at. SVG不被视为HTML5的一部分，但值得关注。 It's flexible, ubiquitous and, I think, vector graphics is a better option for geometry than bitmaps (Canvas). 它灵活，无处不在，我认为，矢量图形比几何图形（Canvas）更适合几何体。

I think either raphael should be useful: 我认为raphael应该是有用的：

Raphaël is a small JavaScript library that should simplify your work with vector graphics on the web. Raphaël是一个小型JavaScript库，可以简化您在Web上使用矢量图形的工作。 If you want to create your own specific chart or image crop and rotate widget, for example, you can achieve it simply and easily with this library. 例如，如果要创建自己的特定图表或图像裁剪和旋转小部件，则可以使用此库轻松实现。

http://raphaeljs.com/ http://raphaeljs.com/

or processing.js 或processing.js

Processing.js is the sister project of the popular Processing visual programming language, designed for the web. Processing.js是流行的Processing可视化编程语言的姐妹项目，专为Web设计。 Processing.js makes your data visualizations, digital art, interactive animations, educational graphs, video games, etc. work using web standards and without any plug-ins. Processing.js使您的数据可视化，数字艺术，交互式动画，教育图，视频游戏等使用Web标准并且无需任何插件。

http://processingjs.org/ http://processingjs.org/

I can recommend EaselJS because I used it many times to quickly create dynamic drawings, such as triangles, circles, arcs etc. I was even writing a simple draw-with-text tool for students, called Geodrafter . 我可以推荐EaselJS，因为我多次使用它来快速创建动态绘图，例如三角形，圆形，弧形等。我甚至为学生编写了一个简单的绘图工具，称为Geodrafter 。

However, if you want to add eg sliders and have a dynamic environment (easily dragging points, for instance), then JSXGraph is a better choice since they provide a variety of components for this. 但是，如果你想添加例如滑块并拥有动态环境（例如轻松拖动点），那么JSXGraph是一个更好的选择，因为它们为此提供了各种组件。 The gallery in their wiki give some good ideas. 他们维基中的画廊给出了一些好主意。

And as said above: JSXGraph is based on vector graphics, which will always produce exact graphics. 如上所述：JSXGraph基于矢量图形，它将始终生成精确的图形。 EaselJS is based on canvas and can lead to blurry lines. EaselJS基于画布，可能会导致线条模糊。

Your best bet is to use <canvas> and explore the API. 最好的办法是使用<canvas>并探索API。 It should have the basic primitives you need. 它应该具有您需要的基本原语。