Canto.js

Vereinfachtes API für HTML5-Canvas

Der Entwickler und Buchautor David Flanagan hat mit Canto.js eine Javascript-Bibliothek veröffentlicht, die den Umgang mit dem Canvas-Element aus HTML5 vereinfacht, wenn es um 2D-Zeichnungen geht.

Artikel veröffentlicht am ,

Canto.js definiert eine einzelne Factory-Funktion namens canto(). Wird dieser ein Canvas-Element oder die ID eines Canvas-Elements übergeben, gibt die Funktion ein Canto-Objekt zurück. Dabei handelt es sich um einen Zeichen-Kontext, wie ihn auch die Funktion getContext('2d') zurückgibt.

Stellenmarkt
  1. SAP Business Analyst CO (m/w/d)
    Informations-Verarbeitungs-Zentrum (IVZ), verschiedene Standorte
  2. FPGA-Entwickler (m/w/d)
    Basler AG, Ahrensburg bei Hamburg, Mannheim
Detailsuche

Der Vorteil: Das Canto-Objekt implementiert ein vereinfachtes 2D-Zeichen-API, funktioniert ansonsten aber wie gehabt. So soll sich Canto leicht in bestehenden Code integrieren lassen.

Da alle Canto-Methoden, die keine expliziten Rückgabewerte haben, das Canto-Objekt zurückgeben, lassen sich die Funktionen des Canto-APIs leicht verketten. Das kennt man beispielsweise von jQuery. Der Aufruf "canto("canvas_id").moveTo(100,100).lineTo(200,200,100,200).closePath().stroke();" zeichnet beispielsweise ein Dreieck, wobei die Funktion lineTo() vier Argumente aufnimmt, so dass mit einem Aufruf zwei Linien gezeichnet werden können.

Einigen Funktionen, darunter stroke(), drawImage() und fillText(), können zusätzliche Grafikattribute wie Farbe und die Breite der zu zeichnenden Linie mitgegeben werden: "canto("canvas_id").moveTo(100,100).lineTo(200,200,100,200).closePath().stroke({lineWidth: 15, strokeStyle: "red"});"

Flanagan, der einige Bücher zu Java und Javascript für O'Reilly geschrieben hat, hat Canto.js unter der MIT-Lizenz als Open Source freigegeben und den Code unter code.google.com veröffentlicht.

Bitte aktivieren Sie Javascript.
Oder nutzen Sie das Golem-pur-Angebot
und lesen Golem.de
  • ohne Werbung
  • mit ausgeschaltetem Javascript
  • mit RSS-Volltext-Feed


Aktuell auf der Startseite von Golem.de
Astro
Amazons erster Roboter kostet 1.500 US-Dollar

Astro heißt der erste Roboter von Amazon. Es ist eine Art rollender Echo Show mit Schwerpunkt auf Videoüberwachung.

Astro: Amazons erster Roboter kostet 1.500 US-Dollar
Artikel
  1. Amazon Alexa: Neuer Echo Show mit Personenerkennung wird aufgehängt
    Amazon Alexa
    Neuer Echo Show mit Personenerkennung wird aufgehängt

    Amazon erfindet den Echo Show neu: Der Echo Show 15 hat ein besonders großes Display und kann Personen erkennen.

  2. Cupra Urban Rebel: VW-Tochter kündigt Elektrorenner für 25.000 Euro an
    Cupra Urban Rebel
    VW-Tochter kündigt Elektrorenner für 25.000 Euro an

    Autobauer Cupra bringt mit dem Urban Rebel ein günstiges Elektroauto für all jene auf den Markt, denen der ID.Life von VW zu langweilig ist.

  3. Blink Video Doorbell: Amazon stellt Videotürklingel für 60 Euro vor
    Blink Video Doorbell
    Amazon stellt Videotürklingel für 60 Euro vor

    Amazon hat eine Videotürklingel unter dem Blink-Label vorgestellt. Sie soll vor allem mit einem günstigen Preis überzeugen.

Du willst dich mit Golem.de beruflich verändern oder weiterbilden?
Zum Stellenmarkt
Zur Akademie
Zum Coaching
  • Schnäppchen, Rabatte und Top-Angebote
    Die besten Deals des Tages
    Daily Deals • Echo Show 15 249,99€ • eero 6 Wifi 6 System 3er-Pack 299€ • Saturn-Aktion: Win 10-Laptop oder PC kaufen, kostenloses Upgrade auf Win 11 erhalten • Bosch Professional & PC-Spiele von EA günstiger • Alternate (u. a. Asus TUF Gaming-Monitor 23,8" FHD 165Hz 179,90€) • 6 UHDs kaufen, nur 4 bezahlen [Werbung]
    •  /