Forum: Platinen Kicad 3D-Echtzeit Webviewer Mausrotation mit Zoom per Mausrad


Announcement: there is an English version of this forum on EmbDev.net. Posts you create there will be displayed on Mikrocontroller.net and EmbDev.net.
von Joachim L. (nixiefan)



Lesenswert?

Open Source. Kommt mit Sourcecode und Blendfile. How-to und Support von 
mir bei sichtbarem Interesse. Probiert es mal aus:

https://strandedalien.github.io/Kicadviewer/

1920 x 1080 Runterscrollen! um den Ladebalken beim ersten Aufruf zu 
sehen!

Alphaversion! Zoom funktioniert bisher nur mit Maus. Auf dem Handy noch 
nicht. Dort kann man bisher mit den Fingern die Platine  nur drehen. Ich 
arbeite daran.Etwas Geduld.

Dreht die Platine in Echtzeit im Browserfenster. Mausbedienung, Mausrad 
zoomt rein und raus. Für eigene Platine die Meshdaten im Blendfile 
tauschen. Zum Anpassen der Blend muss das kostenlose und OpenSouce 
Armory3D Plugin in Blender Präferenzen installiert werden. Nach 
Austausch der Mesh-Daten, F5 (zum Kompilieren und Starten) drücken. 
Erweiterungsvorschläge und eventuelle Funktionswünsche bitte hier 
posten.

: Bearbeitet durch User
von Meinereiner (Gast)


Lesenswert?

Verstehe ich das richtig, daß ich KiCad ein Zusatz brauche?
Wenn ich aber KiCad gestartet habe, so gibt es doch die 3D-Ansicht.

von Joachim L. (nixiefan)


Lesenswert?

Meinereiner schrieb:
> Verstehe ich das richtig, daß ich KiCad ein Zusatz brauche?
> Wenn ich aber KiCad gestartet habe, so gibt es doch die 3D-Ansicht.

Nein, brauchst du nicht. Nur falls du eigene oder andere Platinen mit 
dem Webbrowser betrachten willst, oder auf dem Handy präsentieren 
möchtest. Dafür ist meine Anwendung da. Das Plugin wird nicht zum 
Abspielen benötigt. Zum Ansehen einfach draufklicken auf obigen Link 
(Fette Platine, dauert beim ersten Mal bis es geladen hat.) Im Browser 
F11 für Fullscreen drücken, falls gewünscht. Dann sieht man auch den 
Ladebalken beim ersten Mal. Blender und das Plugin Armory3D brauchst Du 
nur um Deine eigenen Platinen einzubinden. Wenn du die Platine im Blend 
getauscht hast, musst du mit F5 neu kompilieren und die Dateien des HTML 
Verzeichnisses auf Deine Website hochladen. Du kannst auch eine 
Executable Datei generieren und die auf einem USB Stick weitergeben. 
Kannst Du alles in Blender einstellen. Genaue Hilfe auf Anfrage, bei 
vielen Anfragen schreibe ich bebildertes Howto.

: Bearbeitet durch User
von Johannes S. (demofreak)


Lesenswert?

Joachim L. schrieb:
> Open Source. Kommt mit Sourcecode und Blendfile. How-to und Support von
> mir bei sichtbarem Interesse.

Also mich würde das ja schon interessieren. ;)

von Joachim L. (nixiefan)


Lesenswert?

Johannes S. schrieb:
> Also mich würde das ja schon interessieren. ;)

Du kannst hier anfangen und bei Bedarf spezifische Fragen stellen. Aber 
erst versuchen sich selbst schlau zu machen, ich lebe nur einmal.

https://armory3d.org/

von Auffälig Unauffällig (Gast)


Lesenswert?

Frage: wo ist der Vorteil gegenüber das ganze einfach als glb zu 
exportieren und einfach mitm Modelviewer von Google Anzeigen zu lassen? 
Lässt sich in jede Website einbinden, lässt sich mit Klickbären Hotspots 
erweitern, zommen und drehen funktioniert, gibt ne gute "Tutorial" 
Seite...

Glb oder gltf sind zudem gängige Formate braucht's kein Blender oder 
blendfiles.

von Joachim L. (nixiefan)


Angehängte Dateien:

Lesenswert?

Bei dem simplen Viewer hast du teilweise sogar recht. Aber die 
Kombination Blender/Armory3D lässt sich für weit mehr einsetzen. Hier 
kann ich leicht echt interaktive Modelle erstellen, die Beleuchtung fein 
tunen, eine Physikengine einbinden, externe Hardware wie ESP32 bzw. 
Arduinos mit schnellen bidirektionalen Websockets anbinden.

Einen sehr simpel zu bedienenden GUI Editor für die Programme hats auch. 
Dann muss ich wirklich nur noch das Zielsystem (Web, Android, Linux, 
Windows. Mack,Nodejs etc... auswählen und auf F5 drücken. Es wird 
kompiliert und alle beteiligten Dateien zum Veröffentlichen im 
Projektverzeichnis gesammelt. Bei HTML, zum Bleistift ,reicht dann ein 
Drag and Drop um eine Website zu erstellen.
Blender und Armory3d installieren, Pfade bei Armory3D einstellen 
(https://github.com/armory3d/armory/wiki/setup).

Dann meine Blend von obigem Github Server runterladen, öffnen und 
Select- All by Type mesh auswählen und löschen. Per File Dialog dein 
Modell importieren, Target auswählen (siehe Screenshot) und F5 drücken. 
Schon hast Du deinen eigenen,massgeschneiderten Viewer mit zlib Lizenz 
erstellt.

Der ist dir, da brauchst du keine seltsamen GLTF Viewer 
Lizenzbedingungen lesen. Ach, außerdem kann man bei Blender/Armory3D 
überall visuell mit Nodes Programme erstellen, kein codieren nötig. Und 
jetzt hol ich das Weihwasser gegen die GLTF Viewer ;-)

: Bearbeitet durch User
von Auffälig Unauffällig (Gast)


Lesenswert?

Ist ja ganz nett, dass das theoretisch inrgendwann vielleicht irgendwie 
möglich ist, aber wenn gerade zoomen noch nicht funktioniert, ist der 
model Viewer dann doch die bessere Alternative.

von Joachim L. (nixiefan)


Lesenswert?

Du hast weder meinen ersten Beitrag richtig gelesen, noch meine Demo 
getestet. Wenn du es mit einem PC ausprobierst, zoomt es mit dem 
Mausrad. Da das Beispiel aber genauso mit dem Handy aufgerufen werden 
kann, klappt das nicht weil bisher kein Pinch and Zoom funzt. Anonyme 
Beiträge wo ich nicht erkennen kann, das sie die Demo ausprobiert haben, 
werde ich fortan ignorieren. Auf der Unterseite der Platine steht der 
Hersteller, wer den nicht nennt hat nicht getestet. Trolle tot.

: Bearbeitet durch User
von Auffälig Unauffällig (Gast)


Lesenswert?

Das ist auf jeden Fall eine erwachsene Argumentation und erinnert gar 
nicht an ein Kind das schreiend auf dem Boden liegt. Aber passt zum 
heutigen Zeitgeist, alle die nicht meiner Meinung sind, sind Trolle. Ich 
wünsche dir dennoch viel Erfolg, vielleicht ist es ja wirklich 
inrgendwann besser als der model Viewer.

von Émile (Gast)


Lesenswert?

Hübsch. Aber muss der Hintergrund sein? Sieht es in Bulgarien so aus?

Es wäre schicker, wenn nicht bereits die Bewegung des Mauszeigers die 
Rotation auslöst, sondern das nur mit gedrückter Maustaste geschieht. 
Dann nämlich kann man sich den Punkt aussuchen, um den rotiert wird, was 
bei der Handhabung deutlich besser ist. Verschieben können, um bei 
größeren Zoomfaktoren nicht nur die Mitte der Platine zu sehen, ist auch 
dringend erforderlich.

von Joachim L. (nixiefan)


Lesenswert?

Émile schrieb:
> Hübsch. Aber muss der Hintergrund sein? Sieht es in Bulgarien so aus?
>
Ja, das ist eine Umgebungstextur (Neudeutsch environment texture) im HDR 
Format und verhilft zu einer realistischen Beleuchtung. Die Szene zeigt 
den Strand von Blouberg in Südafrika.

> Es wäre schicker, wenn nicht bereits die Bewegung des Mauszeigers die
> Rotation auslöst, sondern das nur mit gedrückter Maustaste geschieht.
> Dann nämlich kann man sich den Punkt aussuchen, um den rotiert wird, was
> bei der Handhabung deutlich besser ist. Verschieben können, um bei
> größeren Zoomfaktoren nicht nur die Mitte der Platine zu sehen, ist auch
> dringend erforderlich.

Also mir gefällt die Bedienung so. Außerdem ist Pinch and Zoom fürs 
Handy zuerst dran. Allerdings kannst Du dir das Blendfile (das ist die 
Source) gerne Runterladen und das ganze nach deinem Geschmack abändern. 
So hatte ich mir das Ganze auch gedacht, als Bastelvorlage für kreative 
Leute. Panfunktion ist hier nicht nötig, da man wirklich alle Details 
einwandfrei erkennen kann.

Was sich relativ einfach machen lässt, ist das Ganze gegen eine FPS 
Steuerung auszutauschen, dann kannst wie im Computerspiel auf der 
Platine herumlaufen. Zeitaufwand weniger als eine Stunde, wenn man weiss 
wie. Die FPS Steuerung kannst du hier kopieren: 
https://github.com/StrandedAlien/Archviz-Litterbug-Den

Blend runterladen und mit Append Kamera, Empty und die Kapsel 
importieren. Logik aus Nodes müsste dann automatisch mit dabei sein.

: Bearbeitet durch User
von Mathias (Gast)


Lesenswert?

Ist das jetzt ein Spielprojekt für dich, oder hast du höhere Ambitionen?

Ich finde die Bedienumg mit der Maus grausam. Gezielt eine Seite 
ansteuern ist mühselig. Warum eine Zoomfunktion haben, wenn man nicht 
verschieben kann? Q3 sieht ja nett aus, aber was mache ich, wenn mich 
was bei R5 interessiert?

Der Hintergrund ist super nervtötend. Welche Farbe sich in den 
Metallteilen spiegelt ist mir sowas von egal.

Und du willst das für Mobil optimieren? Lass erstmal die 25MB HDR Daten 
weg.

Kommt halt darauf an, was du willst. Deine Javascript künste 
Präsentieren? Dann mach so weiter. Deine Schaltung Präsentieren? Dann 
lass quatsch weg und mach es brauchbar.

Wenn es dir so gefällt, dann verschwende nicht unsere Zeit.

von Matthias 🟠. (homa)


Lesenswert?

Joachim L. schrieb:
> ... Wenn du es mit einem PC ausprobierst, zoomt es mit dem
> Mausrad.

Nein, tut es nicht! FF neuster. Und ich finde Rotation dürfte nur sein, 
wenn man die linke Maustaste gedrückt hält. Sonst dreht man im wahrsten 
Sinne durch.

Achso: olimex

von Joachim L. (nixiefan)


Angehängte Dateien:

Lesenswert?

Matthias 🟠. schrieb:
> Joachim L. schrieb:
>> ... Wenn du es mit einem PC ausprobierst, zoomt es mit dem
>> Mausrad.
>
> Nein, tut es nicht! FF neuster. Und ich finde Rotation dürfte nur sein,
> wenn man die linke Maustaste gedrückt hält. Sonst dreht man im wahrsten
> Sinne durch.
>
> Achso: olimex

Danke für den Bericht.

zu 1. Zoom: Welches Betriebssystem/Desktopsoftware benutzt du?
Funktioniert das Scrollen mit der Maus bei dir?

2. Bitte nicht durchdrehen ;-) Ich ändere das bei Gelegenheit. Gute 
Idee.

3. zu Olimex. Du warst doch angemeldet, war unnötig und kontraproduktiv. 
Warum hast du das gemacht? Ab jetzt muss also die Speicherkapazität der 
SD Karte genannt werden. Gilt nicht für dich, wenn du angemeldet 
postest.

von Matthias 🟠. (homa)


Lesenswert?

3. ah, sorry missverstanden

1. w11 und ff 107.0 64bit, zoom klappt gar nicht
   korrigiere: update auf 107.1 gemacht, neu start und weiterer test, 
klappt jetzt!

ich finde das ist eine coole Projekt, viel Erfolg!

: Bearbeitet durch User
von Joachim L. (nixiefan)


Lesenswert?

Direkter Link zur Sourceblend: 
https://github.com/StrandedAlien/Kicadviewer

Komisch, das sich bisher keiner beschwert hatte.
Hatte ich vergessen. Mea culpa.

Blender reicht nur zum Öffnen und das 3d-Modell zu bearbeiten. Zum 
Sichten bzw. Ändern der Programmlogik muss auch noch zusäatzlich 
Armory3D installiert sein. Beides kostnix.

https://www.blender.org/download/
https://armory3d.org/download

: Bearbeitet durch User
von Auffälig Unauffällig (Gast)


Lesenswert?

Was hat das ganze eigentlich mit Echtzeit zu tun?

1gb

von aeib (Gast)


Lesenswert?

Vermutlich meint er mit Echtzeit, dass man nicht für jede neue Ansicht 
erst auf Rendern klicken muss. Im 3D-Künstlerbereich durchaus eine 
gängige Verwendung des Worts.

(OT: Echtzeit wird in so vielen Kontexten unterschiedlich gedeutet... 
schreibe gerade eine Dissertation bei der es u.A. um harte Echtzeit geht 
und es ist echt unheimlich was da ganze Branchen (und auch einzelne 
Paper) als "Echtzeit" verkaufen wollen/bewerben insbesondere wenn man 
die wissenschaftliche Definition kennt)

Antwort schreiben

Die Angabe einer E-Mail-Adresse ist freiwillig. Wenn Sie automatisch per E-Mail über Antworten auf Ihren Beitrag informiert werden möchten, melden Sie sich bitte an.

Wichtige Regeln - erst lesen, dann posten!

  • Groß- und Kleinschreibung verwenden
  • Längeren Sourcecode nicht im Text einfügen, sondern als Dateianhang

Formatierung (mehr Informationen...)

  • [c]C-Code[/c]
  • [code]Code in anderen Sprachen, ASCII-Zeichnungen[/code]
  • [math]Formel in LaTeX-Syntax[/math]
  • [[Titel]] - Link zu Artikel
  • Verweis auf anderen Beitrag einfügen: Rechtsklick auf Beitragstitel,
    "Adresse kopieren", und in den Text einfügen




Bild automatisch verkleinern, falls nötig
Bitte das JPG-Format nur für Fotos und Scans verwenden!
Zeichnungen und Screenshots im PNG- oder
GIF-Format hochladen. Siehe Bildformate.

Mit dem Abschicken bestätigst du, die Nutzungsbedingungen anzuerkennen.