Canvasio3D Light Dokumentation 1.4.5

Danke für Ihr Interesse an unserer Software von virtuellwerk.de!

Weitere Infos finden Sie auf unserer Website. Wenn Sie Fragen zu Canvasio3D haben, freuen wir uns über Ihre eMail.

Ihr Team von virtuell werk

Inhaltsverzeichnis

Plugin Installation:

Canvasio3D ist ein einfach zu installierendes Plugin, mit dem Sie 3D-Modelle aus verschiedenen Formaten in WordPress anzeigen können*.
Jetzt Responsive und mit Touch-Screen-Funktion.



Vor einer weiteren Installation bitte die letzte Version des Canvasio3D-Plugins deaktiviert und löschen!


Ein 3D-Model hochladen:

Um ein 3D-Modell hochzuladen, gehen sie mit der Maus einfach links im Menü auf Multimedia und klicken Sie rechts im Popup auf "Dateien hinzufügen".


Ein 3D-Modell kann aus mehreren Dateien bestehen, die Sie alle einfach mit dem Media-Manager von WordPress hochladen können. Mögliche 3D-Formate sind hierbei:



und die üblichen Bild-Formate wie: .jpg / .png, oder .gif.


Die Dateinamen von einem 3D-Modell im Format: .obj mit dazugehöriger .mtl Datei müssen gleich sein, wie zum Beispiel: 3D_Model.obj und 3D_Model.mtl.


Wenn ein 3D-Model nur schwarz dargestellt wird, liegt es eventuell daran, dass eine Textur nicht geladen werden kann. Achten Sie hierbei auf Groß- und Kleinschreibung des Dateinamens der Modell-Textur, vor allem bei der Endung wie zum Beispiel: .jpg oder .JPG.


Ein neues 3D Objektfenster erstellen:

Erstellen Sie in WordPress eine neue Seite und klicken Sie oben in der Menü-Auswahl auf den Karteireiter „Visuell“.
Ein Klick in der Icon-Liste rechts auf das Icon: „3D“ fügt diesen Text in Ihre WordPress-Seite ein:




Markieren Sie mit der Maus nur die drei Punkte bei objPath=”...” und klicken Sie auf den WordPress-Button „Dateien hinzufügen“.




Nach Auswahl eines 3D-Objekt im WordPress-Media Manager wird die URL an der Stelle der drei Punkte eingefügt.




Speichern Sie die Seite und schauen Sie sich die Vorschau an.


Eventuell wird das 3D-Model zu groß oder zu klein dargestellt und ist daher noch nicht zu sehen. Für eine gute Ansicht des 3D-Objekts ändern Sie einfach den Wert von objScale=“0.50“ in einen weit höheren- oder niedrigeren Wert, zum Beispiel von 5.00 bis 0.05.


Anpassung eines 3D-Objektfensters:

Jedes 3D-Objektfenster in Canvasio3D braucht einen einfachen Textbereich um ein 3D-Modell in einer WordPress Seite anzuzeigen. Jeder Textbereich beginnt mit: [canvasio3D ... ] Und endet mit: [/ canvasio3D]. Statt der ... können Sie einzelne Textbefehle einfügen wie zum Beispiel: color = "#ffffff"




Canvasio3D bietet Ihnen viele Möglichkeiten Objektfenster individuell anzupassen. Ergänzen Sie einfach weitere Textbefehle, oder entfernen Sie vorhandene. Möchten Sie vielleicht einen Rahmen um ein Objektfenster? Dann schreiben Sie einfach: border=“2“ innerhalb des Canvasio3D-Textbereich für ein Ojektfenster, also: [canvasio3D border=“2“ ][/canvasio3D]


Der Wert 2 gibt hierbei die Stärke an, mit dem der Rahmen gezeigt werden soll.



Alle Textbefehle müssen durch Leerezeichen getrennt sein und bestehen immer aus: Textbefehle="Wert"


Zurück nach oben

3D-Fenster | Short-Code Befehle:

  • width=" " ( Breite des Objektfenster – Zahl – Maximal: 940 )
  • height=" " ( Höhe des Objektfenster – Zahl – Maximal: 940 )
  • text=" " ( Info-Text im Objektfenster )
  • textCol=" " ( Textfarbe in Hex-Farbwert z.B.: #FF9900 )
  • border=" " ( Rahmenstärke z.B.: 3 – Zahl )
  • borderCol=" " ( Rahmenfarbe in Hex-Farbwert z.B.: #dddddd )
  • backCol=" " ( Hintergrundfarbe des Objektfenster in Hex-Farbwert z.B.: #FFFFFF )
  • dropShadow=" " ( Schattenrahmen des Objektfenster z.B.: 4 – Zahl )
  • loadingText=" " ( Alternativer Text an Stelle von "Loading ..." )
  • Help=" " ( on / off - Zeigt Fehlermeldungen )

Code Beispiele

In allen Beispiel-Codes bitte "…" durch Ihre URL ersetzen! (Pfade für Ihr 3D-Objekt / Textur)


Texteintrag für ein Standard-Objektfenster :

[canvasio3D objPath="..." width="280" height="220" objScale="0.50" lightSet="1" Mouse="on"][/canvasio3D]

Objektfenster mit automatischer Y-Rotation :

[canvasio3D objPath="..." width="280" height="220" objScale="0.50" lightSet="1" rollSpeedY="10" rollMode="auto"][/canvasio3D]

Objektfenster mit automatischer X- und Y-Rotation bei "Mouse-Over" :

[canvasio3D objPath="..." width="280" height="220" objScale="0.50" lightSet="1" rollSpeedX="5" rollSpeedY="10" rollMode="MouseOver"][/canvasio3D]

Standard-Objektfenster mit Rahmen, grauem Hintergrund und Rahmenschatten :

[canvasio3D objPath="..." width="280" height="220" objScale="0.50" lightSet="1" Mouse="on" border="2" backCol="f6f6f6" dropShadow="4"][/canvasio3D]

Standard-Objektfenster mit Rahmen, grauem Hintergrund, Rahmenschatten und Reflektion :

[canvasio3D objPath="..." width="280" height="220" objScale="0.50" lightSet="1" Mouse="on" border="2" backCol="f6f6f6" dropShadow="4" reflection="shine2" refVal="5"][/canvasio3D]

Objektfenster mit Reflektion, Objektschatten und Boden :

[canvasio3D objPath="..." width="280" height="220" objScale="0.50" lightSet="5" reflection="shine3" refVal="5" floor="on" floorHeight="42"][/canvasio3D]


ChangeLog

Version 1.2.4 --------------------------------------------------------------------------------------------------------------------------------------------

- Update auf Three.js V73
- Bug removed for reflections
- Now compatible to Canvasio3D Pro

Version 1.2.3 --------------------------------------------------------------------------------------------------------------------------------------------

- Update auf Three.js V71
- Neues Commando: "Help" für Support
- Code optimiert
- Default .stl Modell hinzugefügt

Version 1.1.8 --------------------------------------------------------------------------------------------------------------------------------------------

BugFixes:
- Fehler bei Anzeige von "Loading..." behoben
- Darstellung eigener Objektfarbe korrigiert für: .obj / .js
- Werte der LightSets korrigiert

Neue Funktionen:
- Neue LightSets 9 und 10 hinzugefügt
- Licht-Rotation hinzugefügt. Neues Textkommando: lightRotate="on"

Version 1.1.7 --------------------------------------------------------------------------------------------------------------------------------------------

BugFixes:
- Neue Ladefunktion für Objekt

Neue Funktionen:
- Verbesserte Darstellung des Objektmaterials

Version 1.1.5 --------------------------------------------------------------------------------------------------------------------------------------------

BugFixes:
- Startproblem bei einigen Templates behoben
- Update auf Three.js V66 -

Neue Funktionen:
- Individuelles Hintergrundbild je Objektfenster laden. Neues Textkommando: backImg=" "

Version 1.1.3 --------------------------------------------------------------------------------------------------------------------------------------------

BugFixes:
- Loader-Geschwindigkeit optimiert
- Speicheranforderung optimiert
- Fensterskalierung verbessert (Responsive Funktion)
- Update auf Three.js V65 -

Neue Funktionen:
- Standardeintrag erweitert (Beim drücken des 3D-Icons im Texteditor)
- rollSpeedX wird nicht mehr unterstüzt. Neues Textkommando: rollSpeedV=" "
- rollSpeedY wird nicht mehr unterstüzt. Neues Textkommando: rollSpeedH=" "

Version 1.1.2 --------------------------------------------------------------------------------------------------------------------------------------------

BugFixes:
- Loader für das .obj Format optimiert
- LightSet 5,6,7 und 8 für Schattenfunktion angepasst
- Bodendarstellung überarbeitet

Neue Funktionen:
- Bodenhöhe ist jetzt einstellbar. Neues Textkommando: floorHeight=" "
- Objektschatten hinzugefügt. Neues Textkommando: objShadow=" "

Version 1.1.0 --------------------------------------------------------------------------------------------------------------------------------------------

BugFixes:
- .obj Format korrigiert. Einige .obj Formatdateien wurden nicht nicht dargestellt
- .obj Format / Das Kommando objCol arbeitet nun zusammen mit Texture-Layern
- Die Kommandos: loadingText, ambient und shine funktionieren nun korrekt in Objekt Windows
- Geschwindigkeit für Objekt Windows optimiert
- Alle LightSets verbessert

Neue Funktionen:
- LightSet 8 hinzugefügt
- Lade-Progress in Prozent hinzugefügt
- Objektreflektion hinzugefügt. Neue Textkommandos: reflection=" " and refVal=" "

Software Disclaimer

Die Software wird vertrieben wie sie ist. Ohne Garantien irgendwelcher Art, weder ausdrücklich noch sinngemäß, einschließlich der Gewährleistung für die Marktgängigkeit oder Eignung für einen bestimmten Zweck. Der User (Sie) übernimmt das vollständige Risiko des Gebrauchs der Software. Unter keinen Umständen ist eine Person, ein Unternehmen oder eine Organisation, die an der Entwicklung, dem Verkauf oder dem Vertrieb dieser Software beteiligt ist, für irgendwelche Schäden haftbar, die aus dem Gebrauch, dem Missbrauch oder dem Unvermögen, die Software anzuwenden, entstehen (einschließlich und ohne Einschränkung Schadenersatz für entgangenen Gewinn, Geschäftsunterbrechung, Informationsverlust oder jeden anderen Verlust).


*Seit März 2011 wird WebGL von Googles Webbrowser Chrome und Mozillas Firefox unterstützt und ist in Browser-Vorabversionen von Safari und Opera standardmäßig aktiviert. WebGL benötigt eine 3D-Hardwarebeschleunigung (3D-Grafikkarte / 3D-Chip). Quelle: Wikipedia