Scripting SVG

Question

Ich bin angesichts einer Website ähnlich wie Stackoverflow zu entwickeln, aber die Antworten auch von Zeichnungen (Schemata, in diesem Fall) bestehen kann. Ich möchte einen Bereich, in dem Antwortformular haben, wo sie dieses Schema ohne spezielle Plugins machen usw.

1. Sind wir zu dem Punkt, wo SVG hat oder sollte bald eine kritische Masse haben (1-2 Jahre), so dass das Entwerfen einer Website, auf der skriptgesteuertes SVG als primäres Feature ausgeführt wird, sinnvoll ist (dh Firefox oder einen anderen SVG/AJAX-kompatiblen Browser erfordert)?
2. Was sind einige gute Ressourcen für das Lernen Cross-Plattform-SVG-Scripting (wahrscheinlich in JavaScript)?

-Adam Davis

Answer 1

gehen Leider habe ich keine Antwort, aber ich habe drei Hinweise auf Projekte, die Sie betrachten könnten.

Die erste ist die Lively Kernel von Dan Ingalls (ja, die Dan Ingalls) bei Sun Labs. Es ist eine Implementierung einer Smalltalk Virtual World in JavaScript über SVG. Genauer gesagt ist es eine Implementierung des Morphic GUI-Frameworks von Squeak Smalltalk in JavaScript mit SVG und einem Port von (Teilen von) Squeak Smalltalk in JavaScript.

Oder, wenn Sie kein Smalltalker sind und das oben genannte für Sie keinen Sinn ergibt: Es ist ein Betriebssystem, geschrieben in JavaScript mit dem JavaScript-Interpreter als CPU, SVG als Grafikkarte und dem Browser als Computer.

Dies ist ungefähr so ​​extrem wie es geht, wenn es um JavaScript und SVG geht. Und es funktioniert nur vollständig in Safari 3 und teilweise in Firefox 3, obwohl es auch einen experimentellen Port zum Internet Explorer gibt.

Das zweite Projekt ist John Resigs Processing.js Port der Verarbeitungsvisualisierungssprache zu JavaScript. Es verwendet das <canvas> Element anstelle von SVG genau wegen der Probleme, die Sie erwähnten. Dieser funktioniert jedoch nur in Firefox 3.

Der dritte ist Real-Time 3D in JavaScript von Useless Pickles. Es verwendet nur JavaScript, DOM und CSS und keine SVG oder <canvas> oder Flash oder was auch immer. Und ist es zu fast jedem Browser portierbar, einschließlich Internet Explorer 7 und aufwärts. 2D zu machen sollte noch einfacher sein.

Zwischen diesen drei Projekten sollten Sie in der Lage sein, etwas Inspiration zu finden und auch einige Leute zu finden, die versuchten, mit JavaScript und SVG oder JavaScript und Graphics den Umschlag zu öffnen und Ihnen sagen, was funktioniert und was nicht.

Fazit: tun Cross-Browser SVG oder Cross-Browser <canvas> ist fast unmöglich, aber mit einem wenig Verrücktheit, Cross-Browser-Grafiken ohne SVG oder <canvas> möglich.

Answer 2

1/wahrscheinlich nie - wenn IE wollte es hinzufügen, dann würde ich, obwohl es so jetzt getan hätte haben; Es gibt jedoch Problemumgehungen mit SilverLight und Gecko Rendering bereitzustellen. Auf der anderen Seite stehen Browser-übergreifende Grafik-APIs zur Verfügung. Ich habe Largish Front Ends mit XULRunner und SVG gemacht, aber nichts im Internet, das für IE sorgen musste. Die beiden am häufigsten genannten waren die SVG pages on mozilla.org und die SVG DOM reference. Alle meine SVG Links sind hier auf delicious

Es gibt einen vorhandenen Editor bei http://www.bpel4chor.org/editor/; Auch wenn alles, was Sie wollen, Diagramme sind, in denen alle Bögen auf einem Gitter sind, können Sie das sehr gut mit divs und Bildern ohne SVG tun. Oder du könntest einfach die

Answer 3

Als @jwmittag erwähnt <canvas> ist eine Option.

Es funktioniert in Saffari und Firefox 3, Opera 9 und people are developing support for IE.

Sie können problemlos Mausklicks erfassen, die mit dem aktuellen Werkzeug und den Eigenschaften verknüpft sind. Die Zeichenfläche auf jeder Seitenanzeige neu zeichnen.

Ich habe gerade ein Projekt mit <canvas> abgeschlossen und es ist eine einfache und sehr leistungsfähige API zu arbeiten, vor allem, wenn Sie jemals irgendwelche OpenGL oder Kairo Arbeit getan haben.

Viel Glück, klingt wie ein cooles Projekt.

Answer 4

Raphael sieht aus wie eine interessante Sicht auf das Problem der Cross-Browser-Vektorgrafiken.

Answer 5

SVGWeb ist ein Skript, das Flash-ähnliche IE-Funktionen für fast-native SVG zu IE hinzufügt. Alle anderen gängigen Browser unterstützen SVG.

http://code.google.com/p/svgweb/