Kostenlose Software zum Zeichnen von 2D-Grundrissen

Ich suche etwas wie FlDraw , um Grundrisse von Einkaufszentren, Büros, Industrieanlagen und dergleichen zeichnen zu können.

Geben Sie hier die Bildbeschreibung ein

Der Haken ist, dass ich möchte, dass die Teile des Grundrisses identifizierbar sind. Das heißt, ich werde den Grundriss in eine Webseite einbetten und wenn der Benutzer klickt, möchte ich in der Lage sein, das Geschäft, das Büro, den Raum usw. zu identifizieren, auf das er geklickt hat, vorzugsweise mit AngularJs, aber das einfache alte JS reicht zur Not aus .

Tatsächlich _könnte_ diese Frage eine zweiteilige Frage sein – eine, um die Grundrisse zu zeichnen, und – der kniffligere Teil – ein Programm, um das Bild so in Segmente aufzuteilen (stellen Sie sich vor, Sie nehmen eine Karte der USA und skizzieren die Bundesstaaten). (Angular) JS kann feststellen, wann man geklickt hat.

Ich bevorzuge eine Windows-App, bin aber auch offen für Linux.

[Update] Ich benötige SVG, wobei jeder Raum durch einen separaten SVG-Pfad gekennzeichnet ist

[Update++] Ich möchte nur 2D, nicht 3D, und ich möchte nur Wände, Türen, Treppen und dergleichen zeichnen. Was ich nicht möchte, sind viele Optionen für Sofas, Füllschränke, Topfpflanzen und dergleichen. Dies ist für Einkaufszentren und Industrieanlagen. Ich nehme an, ich habe nichts dagegen, dass es einige Ikonen-Toiletten gibt, Notfälle, aber ich kann ohne diese leben, wenn es sein muss.

Schwarz-Weiß ist einfach gut. Ich kann colo(u)r später im HTML hinzufügen, wenn ich möchte.

Das Wichtigste ist, dass jeder Raum ein separater SVG-Pfad ist, sodass zwei benachbarte Räume wirklich zwei sich berührende, aber getrennte „Wände“ zwischen sich haben müssen, nicht nur eine einzelne Linie. Auf diese Weise kann ich jeden Raum in einen SVG-Pfad einschließen und Klicks innerhalb des Raums erkennen.

Es folgt schlechte ASCII-Grafik

+--------------------++--------------------+
|                    ||                    |
|      Room 1        ||      Room 2        |     <----- like this
|                    ||                    |
|   /                ||  /                 |
+--/     ------------++-/        ----------+


+--------------------+--------------------+
|                    |                    |
|      Room 1        |      Room 2        |    <----- NOT like this
|                    |                    |
|   /                |  /                 |
+--/     ------------+-/        ----------+
Betrachten Sie eine Imagemap
Exzellente Idee. Ich habe tatsächlich einmal ein paar Sachen mit einem codiert und hatte es total vergessen (+1). Jetzt brauchen Sie nur noch eine Grundriss->Image-Map-App :-)
Oder ich nehme die modernere HTML5-Leinwand und definiere jeden Raum als Pfad und verwende ihn isPointInPath(), um Klicks zu erkennen

Antworten (1)

Um deine zwei Fragen zu beantworten:

  1. Ich musste neulich einen Grundriss zeichnen und habe dafür SweetHome3D verwendet ( http://www.sweethome3d.com ; Windows, Mac OS X 10.4 bis 10.12, Linux und Solaris; „Sweet Home 3D ist eine kostenlose Einrichtungsanwendung, die dabei hilft Sie zeichnen den Grundriss Ihres Hauses, arrangieren Möbel darauf und besichtigen das Ergebnis in 3D"). Ich fand es sehr einfach zu bedienen und es bietet verschiedene Möglichkeiten, Ihren Plan zu exportieren (PDF, SVG).
  2. Nachdem Sie Ihren Grundriss gezeichnet haben, können Sie ihn als SVG exportieren, in verschiedene Bilder aufteilen und diese mit einem Vektorgrafik-Editor (Illustrator, Inkscape, ...) nach Bedarf skalieren. Danach könnten Sie alle Bilder mithilfe von HTML/CSS/JS/AngularJS wieder zusammensetzen und sie mit einer AngularJS-Funktion verknüpfen, die dann den onClick verarbeitet.
Willkommen an Bord! Gute Antwort :-( Ich hatte Angst, dass ich das tun muss (+1). Kennen Sie eine Möglichkeit, das Aufteilen des SVG-Bildes zu automatisieren?
Vielen Dank! :) Nein, ich kenne keinen vollständig automatisierten Weg, dies zu tun. Normalerweise verwende ich Adobe Illustrator für diese Art von Arbeit. Illustrator bietet die Möglichkeit, verschiedene Teile einer SVG auf ein Exportfeld zu ziehen und dort abzulegen, wo man dann definieren kann, wie alle abgelegten Teile (PNG, JPG, SVG, PDF) mit einem Klick exportiert werden. SweetHome3D erstellt ein SVG mit mehreren Gruppen von Elementen. Die Stockwerke sind getrennt und können direkt per Drag & Drop verschoben werden. Die Wände sind verbunden, sodass Sie sie manuell teilen müssten.
Ich denke darüber nach, Inkscape zu verwenden und jeden Raum auf eine separate Ebene zu legen. Mit überlappenden Ebenen betrachtet, erscheint der Grundriss vollständig, wobei die Wände jedes Raums den nächsten Raum berühren, aber ich könnte trotzdem jede Ebene als HTML5-Leinwandpfad exportieren.
Kostenlose Software zum Zeichnen von 2D-Grundrissen
AntwortenHierDatenschutz-Bestimmungen1y, 0v