Dispersión Plot 3D para aplicación web

Question

Estoy buscando un componente 3D de Scatter Plot para una aplicación web. En este momento estoy usando JMathPlot (dentro de un applet de Java) para producir algo como esto:

alt text http://jmathtools.berlios.de /lib/exe/fetch.php?media=scatterplot3d.png

JMathPlot está bien, pero le falta alguna funcionalidad requerida (estoy especialmente interesado en tener información sobre herramientas para los puntos de trazado).

¿Hay alguna alternativa? Cualquier tecnología web interactiva (javascript, applet de java, flash, silverlight) está bien. El usuario debe poder rotar / hacer zoom en el trazado y ver la información sobre herramientas, al pasar el mouse sobre un punto.

Answer 1

Hay varios motores 3D simples para ambos Silverlight (por ejemplo, http://www.markdawson.org/ Kit3D / o http://www.codeplex.com/aXelerateSL3D ) y flash ( listar aquí ) dado que sabes que ActionScript, VB.NET o C # debería ser fácil crear un gráfico de este tipo.

La versión 10 de flash incluso tiene un integrado en simple " 3d engine " :

  

Flash Player 10 permite la traducción xyz   y xyz rotación de superficies 2D en el   Ejes x, y y z. Flash Player 10 también   Muestra la perspectiva y la cámara.   ángulos que configuras para crear 3D   efectos.

Probablemente sea todo lo que necesitas para construirlo tú mismo rápidamente.

Dado que JMathPlot es de código abierto, adoptarlo para sus necesidades podría ser otra opción.

Answer 2

También puede consultar Processing . Es posible que no tengan componentes listos para usar, pero hay miles de buenos ejemplos de código fuente en la web.

Answer 3

Sugerencia de James Black para usar la etiqueta del lienzo, es una muy buena, pero requiere un navegador no IE actualizado. O lo hace? Gracias a google, podrá usar Chrome Renderer dentro de IE . De esta manera, apuntaría a los navegadores habilitados para HTML5 (Gecko, Webkit y Presto) con sus gráficos dinámicos, y pida a los usuarios de IE que instalen el complemento de Google una vez que salga. canvas funciona en todos los navegadores gracias al soporte nativo en todo lo que no sea IE, y a Explore Canvas plugin para IE. El soporte SVG también está disponible en todos los navegadores gracias a algunos complementos para IE . Tenga en cuenta que si necesita Chrome Renderer para IE, no necesita nada más.

Puede usar el lienzo o svg para hacer los gráficos , y ya hay algunos bibliotecas para hacerlo . Ambas tecnologías le permiten crear gráficos dinámicos , pero tienen algunos enfoques diferentes.

SVG                                        canvas
-------------------------------------------------------------------------------
Has scene DOM (SVG DOM, though)            Single HTML element, 
                                           rendering script-driven
Deals in shapes                            Deals in pixels
Somewhat hard to mix with HTML (not XHTML) Behaves like an image in both
Event handling easy                        Event handling hard

Pensaría que iría con SVG para hacer lo que quieras, ya que será muy sencillo agregarle etiquetas dinámicas, pero será difícil crear un sistema verdaderamente flexible. API para gráficos de dispersión de pseudo 3D.

El problema con svg es que al intentar hacer un lenguaje muy flexible, tienes uno muy complejo. Aquí puede ver el código escrito en ambas bibliotecas que hacen lo mismo.

SVG

var rect = document.createElementNS(SVG_NS, "rect");
rect.setAttribute("x", "5");
rect.setAttribute("y", "5");
rect.setAttribute("width", "20");
rect.setAttribute("height", "20");
rect.setAttribute("fill", "red");
parent.appendChild(rect);

var poly = document.createElementNS(SVG_NS, "polygon");
poly.setAttribute("fill", "green");
poly.setAttribute("points", "-40,40 0,-40, 40,40");
parent.appendChild(poly);

Lienzo

with (ctx) {
  fillStyle = "red";
  fillRect(5, 5, 20, 20);
}

with (ctx) {
  fillStyle = "green";
  beginPath();
  moveTo(-40, 40);
  moveTo(0, -40);
  moveTo(40, 40);
  closePath();
  fill();
}

Answer 4

FlashAndMath tiene algunas bibliotecas interesantes para este tipo de cosas:

http://www.flashandmath.com/advanced/contours/combo.html

Answer 5

Puedes verlo haciendo esto con la etiqueta del lienzo, y para cualquier navegador actualizado, excepto IE, puedes obtener información sobre herramientas, ya que tiene eventos como cualquier otra etiqueta html.

Puedes obtener la mayor parte de la funcionalidad en IE usando excanvas, simplemente no he tenido suerte de dibujar texto.

No es una biblioteca, pero le brindaría la capacidad de trabajar solo en html con javascript.

Answer 6

El diagrama de dispersión 3D de canvasXpress ofrece una alternativa de JavaScript y Canvas. http://canvasxpress.org/scatter3d.html