DrawerJs Download - DrawerJs Quellcode Download

DrawerJs

Andere Ressourcen

1.0.0

Herunterladen

Schubladen

DrawerJs ist ein HTML5 -Widget, mit dem das Zeichnen und Schreiben auf HTML5 -Leinwandelementen ermöglicht wird. Mobile Geräte werden vollständig unterstützt.

Es ist ein anpassbarer Wysiwyg -HTML -Leinwand -Editor für Freihandschwerpunkte und Erstellen von Skizzen mit einfachen Formen.

Was sind Schublade? Wie kann ich es verwenden?

Hier finden Sie weitere Informationen zu Funktionen und kurze FAQ: Schublade

Und hier finden Sie einige Beispiele und Sie können es live testen: Schublade auf GitHub

Hier finden Sie eine detaillierte Dokumentation über die Verwendung und ihre Konfiguration: DrawerJs-Docs

Versionshinweise

Hier sind die Versionshinweise des Bereitstellers seit 2015: DrawerJs-Release-Notizen

Beitragen?

Wenn Sie einen Beitrag leisten oder nur bei PR helfen möchten, kontaktieren Sie mich bitte!

Kennen Sie unsere andere JavaScript -Bibliothek?

Schauen Sie sich unseren Imagator -Uploader -Imagärjs an!

Dokumentation:

Verteilungsversionen

Konfigurationsoptionen

Entwicklungsumgebung Setup

Quellcode -Dateien und Systemübersicht erstellen

Quellcode -Architekturübersicht

Plugin -Versionen

Dieses Plugin verteilt sich in zwei Versionen:

Redactor Editor Plugin

Könnte wie folgt auf Seite eingebettet werden:

 <link rel="stylesheet" href="dist/drawerJs.css"/>

<script src="dist/drawerJs.redactor.js"></script>

<!-- or minified version: -->

<script src="dist/drawerJs.redactor.min.js"></script>

Informationen zum Erstellen von allem im dist Ordner finden Sie unter Development How-to

Anschließend kann der drawer bereitgestellt werden, um die Konfiguration von Actor in den Abschnitt plugins zu redetieren:

 $('.redactor').redactor({
    buttons: [
        'bold',
        'html',
        'image'
    ],
    plugins: [
        'video',
        'drawer', // << here we specify that redactor should load this plugin
        'opensave',
        'contexttoolbar'
    ],
    drawer: {
        // drawer config section here
        activeColor: '#19A6FD' // default drawing color
    }
});

Zum Beispiel für ein Beispiel siehe demo -Ordner.

Weitere Informationen zum Abschnitt "Drawer Config

Eigenständige Version

Könnte wie folgt auf Seite eingebettet werden:

 <link rel="stylesheet" href="dist/drawerJs.css"/>

<script src="dist/drawerJs.standalone.js"></script>

<!-- or minified version: -->

<script src="dist/drawerJs.standalone.min.js"></script>

Informationen zum Erstellen von allem im dist Ordner finden Sie unter Development How-to

Anschließend kann die Schublade an einen solchen HTML -Container beigefügt werden:

 var canvas = new DrawerJs.Drawer(null, {
    // drawer config section here
    activeColor: '#19A6FD' // default drawing color
}, 600, 600); // height and width of drawer will be 600x600

$('#some_id').append(canvas.getHtml());
canvas.onInsert();

Wobei #some_id eine DOM -Element -ID ist.

Beispiele für ein Arbeitsbeispiel finden Sie examples/standalone -Ordner.

Weitere Informationen zum Abschnitt "Drawer Config

Konfiguration

Wenn Sie mit der Einrichtung der Entwicklungsumgebung fertig sind, haben Sie DIST -Ordner mit allem, was aufgebaut ist. Suchen Sie dort nach docs -Ordner, finden Sie index.html und öffnen Sie ihn.

Dann funktioniert der Link unten.

Bitte untersuchen Sie die Dokumentation der Leinwand, um die Optionsbeschreibung zu erhalten.