CanvasRenderingContext2D

Das CanvasRenderingContext2D-Interface stellt den 2D-Renderkontext für die Zeichenoberfläche eines <canvas> zur Verfügung. Es wird zum Zeichnen von Formen, Text, Bildern und anderen Objekten benutzt.

Eigenschaften und Methoden finden Sie in der Sidebar und weiter unten. Das Canvas-Tutorial bietet Ihnen außerdem weitere Informationen, Beispiele und Ressourcen.

Ein einfaches Beispiel

Um eine CanvasRenderingContext2D Instanz zu erhalten, muss man erst ein  HTML <canvas> Element haben, mit dem man arbeiten kann:

<canvas id="my-house" width="300" height="300"></canvas>

Um ein Objekt dieses Interfaces zu erhalten, benutzen Sie die Methode getContext() eines <canvas>, mit "2d" als Argument:

const canvas = document.getElementById('my-house');
const ctx = canvas.getContext('2d');

Sobald Sie den Kontext der Zeichenoberfläche haben, können Sie darin zeichnen, was immer Sie möchten. Dieser Code zeichnet ein Haus:

// Die Lininestärke festlegen
ctx.lineWidth = 10;

// Wand
ctx.strokeRect(75, 140, 150, 110);

// Tür
ctx.fillRect(130, 190, 40, 60);

// Dach
ctx.moveTo(50, 140);
ctx.lineTo(150, 60);
ctx.lineTo(250, 140);
ctx.closePath();
ctx.stroke();

Die enstandene Zeichnung sieht so aus:

Referenz

Rechtecke zeichnen

Es gibt drei Methoden, die sofort Rechtecke innerhalb des Canvas zu zeichnen.

CanvasRenderingContext2D.clearRect()
Setzt alle Pixel im Rechteck mit Startpunkt (x, y) und Größe (width, height) auf schwarz und transparent wodurch jeglicher vorheriger Inhalt gelöscht wird.
CanvasRenderingContext2D.fillRect()
Zeichnet ein gefülltes Rechteck mit Startpunkt (x, y) und Größe (width, height).
CanvasRenderingContext2D.strokeRect()
Zeichnet ein Rechteck mit Startpunkt (x, y) und Größe (width, height), verwendet dabei den aktuellem stroke style.

Text darstellen

Die folgenden Methoden zeichnen Text auf dem Canvas. Siehe auch das TextMetrics - Objekt für die Texteigenschaften.

CanvasRenderingContext2D.fillText()
Zeichnet einen gegebenen Text (gefüllt) an die gegebene Position (x, y).
CanvasRenderingContext2D.strokeText()
Zeichnet einen gegebenen Text (Umrisse) an die gegebene Position (x, y).
CanvasRenderingContext2D.measureText()
Gibt ein TextMetrics-Objekt zurück.

Linienstile

Die folgenden Methoden und Eigenschaften beeinflussen die Art und Weise, wie Linien gezeichnet werden.

CanvasRenderingContext2D.lineWidth
Linienbreite. Standard: 1.0
CanvasRenderingContext2D.lineCap
Typ des Linienabschlusses. Mögliche Werte: butt (default), round, square.
CanvasRenderingContext2D.lineJoin
Definiert den Typ der Ecken, wo sich zwei Linien treffen. Mögliche Werte: round, bevel, miter (default).
CanvasRenderingContext2D.miterLimit
Verbindungsecken-Größe. Standard: 10.
CanvasRenderingContext2D.getLineDash()
Gibt das aktuelle Linienstrich-Array zurück, welches eine gerade Anzahl positiver Zahlen enthält.
CanvasRenderingContext2D.setLineDash()
Setzt das aktuelle Linienstrich-Array auf einen neuen Wert.
CanvasRenderingContext2D.lineDashOffset
Spezifiziert, wo auf einer Linie ein Strich-Array beginnt.

Textstile

Die folgenden Eigenschaften bestimmen, wie Text dargestellt wird.

CanvasRenderingContext2D.font
Font-Einstellung. Standard: 10px sans-serif
CanvasRenderingContext2D.textAlign
Ausrichtungs-Einstellung. Mögliche Werte: start (default), end, left, right oder center.
CanvasRenderingContext2D.textBaseline
Ausrichtungseinstellung zur Basislinie. Mögliche Werte: top, hanging, middle, alphabetic (default), ideographic, bottom.
CanvasRenderingContext2D.direction
Direktionalität. Mögliche Werte: ltr, rtl, inherit (default).

Füll- und Linienfarbe

Die Füllfarbe (fillStyle) wird innerhalb von Formen angewendet, die Linienfarbe (strokeStyle) auf die Randlinie von Formen. Beides kann statt einer Farbe auch ein Farbverlauf oder ein Muster sein.

CanvasRenderingContext2D.fillStyle
Farbe oder Stil für innerhalb von Formen. Standardwert #000 (schwarz).
CanvasRenderingContext2D.strokeStyle
Farbe oder Stil für die Randlinie von Formen. Standardwert #000 (schwarz).

Farbverläufe und Muster

CanvasRenderingContext2D.createLinearGradient()
Erzeugt einen linearen Farbverlauf entlang der Linie gegeben durch die Koordinaten, die als Parameter übergeben werden.
CanvasRenderingContext2D.createRadialGradient()
Erzeugt einen radialen (kreisförmigen) Farbverlauf entlang der Linie gegeben durch die Koordinaten, die als Parameter übergeben werden.
CanvasRenderingContext2D.createPattern()
Erzeugt ein Muster aus dem angegebenen Bild (ein CanvasImageSource). Es wiederholt das Bild in den Richtungen, die mit dem repetition Parameter definiert werden. Diese Methode gibt ein CanvasPattern zurück.

Schatten

CanvasRenderingContext2D.shadowBlur
Definiert den Unschärfe-Effekt. Standardwert 0
CanvasRenderingContext2D.shadowColor
Farbe des Schattens. Standardwert: komplett transparentes Schwarz.
CanvasRenderingContext2D.shadowOffsetX
Horizontale Entfernung des Schattens. Standardwert 0.
CanvasRenderingContext2D.shadowOffsetY
Vertikale Entfernung des Schattens. Standardwert 0.

Pfade

Die folgende Methoden können verwendet werden, um Pfade von Objekten zu manipulieren.

CanvasRenderingContext2D.beginPath()
Startet einen neuen Pfad, indem die Liste mit allen Unterpfaden geleert wird. Rufe diese Methode auf, wenn du einen neuen Pfad starten willst.
CanvasRenderingContext2D.closePath()
Sorgt dafür, dass die Stiftspitze zum Start des aktuellen Unterpfades zurückwandert. Es wird versucht eine greade Linie von der aktuellen Position zum Beginn der Linie zu zeichen. Wenn die Form schon geschlossen wurde oder nur einen Punkt enthält, macht diese Funktion nichts.
CanvasRenderingContext2D.moveTo()
Bewegt den Anfangspunkt für einen neuen Unterpfad zu den übergebenen (x, y) Koordinaten.
CanvasRenderingContext2D.lineTo()
Verbindet den letzten Punkt im Unterpfad mit den übergebenen (x, y) Koordinaten in einer geraden Linie.
CanvasRenderingContext2D.bezierCurveTo()
Fügt eine kubische Bézierkurve zum Pfad hinzu. Diese benötigt drei Punkte. Die ersten zwei sind Kontrollpunkte für die Krümmung, der dritte ist das Ende der Kurve. Die Kurve beginnt am letzten Punkt im aktuellen Pfad, dieser kann davor mit moveTo() geändert werden.
CanvasRenderingContext2D.quadraticCurveTo()
Fügt eine quadratische Bézierkurve zum aktuellen Pfad hinzu.
CanvasRenderingContext2D.arc()
Fügt einen Kreisbogen zum Pfad hinzu, mit Kreismittelpunkt (x, y) und Radius r. Der Startwinkel ist startAngle, der Endwinkel endAngle, Richtung gegen den Uhrzeigersinn.
CanvasRenderingContext2D.arcTo()
Fügt einen Kreisbogen zum Pfad mit den gegebenen Kontrollpunkten und Radius hinzu, verbunden mit dem letzten Punkt im Pfad durch eine gerade Linie.
CanvasRenderingContext2D.ellipse()
Fügt eine Ellipse zum Pfad hinzu, mit dem Zentrum (x, y) und den Radien radiusX und radiusY, beginnend bei startAngle und endend bei endAngle, Richtung gegen den Uhrzeigersinn.
CanvasRenderingContext2D.rect()
Erzeugt einen Pfad mit einem Rechteck an der Position (x, y) und den Dimensionen width und height.

Pfade zeichnen

CanvasRenderingContext2D.fill()
Füllt den Unterpfad mit der aktuellen Füllfarbe (bzw. Farbverlauf, Muster).
CanvasRenderingContext2D.stroke()
Zeichnet die Linien des Unterpfades mit der aktuellen Linienfarbe (bzw. Farbverlauf, Muster).
CanvasRenderingContext2D.drawFocusIfNeeded()
Wenn ein gegebenes Element fokussiert wird, zeichnet diese Methode einen Fokusring um den aktuellen Pfad.
CanvasRenderingContext2D.scrollPathIntoView()
Scrollt den aktuellen Pfad oder einen bestimmten Pfad in Sicht.
CanvasRenderingContext2D.clip()
Erzeugt einen zugeschnittenen Pfad aus den aktuellen Unterpfaden. Alles, was nach clip() gezeichnet wird, erscheint nur im zugeschnittenen Pfad. Für ein Beispiel, siehe  Clipping paths im Canvas Tutorial.
CanvasRenderingContext2D.isPointInPath()
Gibt zurück, ob der angegebene Punkt im aktuellen Pfad enthalten ist oder nicht.
CanvasRenderingContext2D.isPointInStroke()
Gibt zurück, ob der angegebene Punkt innerhalb des bemalten Bereichs im Pfad ist oder nicht.

Transformationen

Objekte im CanvasRenderingContext2D-Renderkontext haben eine aktuelle Transformationsmatrix und Methoden, um diese zu manipulieren. Die Transformationsmatrix wird angewendet, wenn der aktuelle Pfad erzeugt wird und wenn Text, Formen oder Path2D Objekte gemalt werden. Folgende Methoden sind hier für historische und Kompatibilitätszwecke aufgelistet, da heutzutage meistens SVGMatrix Objekte verwendet werden und in Zukunft diese Methoden ersetzen werden.

CanvasRenderingContext2D.currentTransform
Die momentane Transformationsmatrix (SVGMatrix object).
CanvasRenderingContext2D.rotate()
Fügt eine Drehung zur Transformationsmatrix hinzu. Der angle-Parameter stellt einen Drehwinkel im Uhrzeigersinn dar und wird in radians ausgedrückt.
CanvasRenderingContext2D.scale()
Fügt eine skalierende Transformation zu den Längeneinheiten des canvas hinzu (horizontal um Faktor x, vertikal um Faktor y). Was nach scale() auf das canvas gezeichnet wird, wird also dementsprechend gestaucht oder gestreckt.
CanvasRenderingContext2D.translate()
Fügt eine übersetzende Transformation hinzu, die die Position des canvas relativ zu seinem Koordinatensystem verschiebt (horizontal um x, vertikal um y). Was nach translate() gezeichnet wird, ist also um (x, y) verschoben.
CanvasRenderingContext2D.transform()
Multipliziert die aktuelle Transformationsmatrix mit der Matrix, die durch die Parameter dieser Funktion beschrieben wird.
CanvasRenderingContext2D.setTransform()
Setzt die aktuellen Transformationen zurück und ruft dann die transform() Methode mit den selben Parametern auf.
CanvasRenderingContext2D.resetTransform()
Setzt die aktuellen Transformationen zurück.

Compositing

CanvasRenderingContext2D.globalAlpha
Alpha-Wert bzw. Deckkraft, die auf alle Formen und Bilder angewendet wird, bevor diese auf dem canvas gezeichnet werden. Standardwert 1.0 (undurchsichtig).
CanvasRenderingContext2D.globalCompositeOperation
Zusammen mit globalAlpha legt dieser Wert fest, wie Formen und Bilder abhängig vom Hintergrund auf das canvas gezeichnet werden sollen.

Bilder zeichnen

CanvasRenderingContext2D.drawImage()
Zeichnet das übergebene Bild. Diese Methode ist in diversen Formaten verfügbar, wodurch sie große Flexibilität in der Nutzung bietet.

Pixelmanipulation

Siehe auch das ImageData Objekt.

CanvasRenderingContext2D.createImageData()
Erzeugt ein neues, leeres ImageData Objekt mit den angegebenen Dimensionen. Alle Pixel in diesem Objekt sind transparent schwarz.
CanvasRenderingContext2D.getImageData()
Gibt ein ImageData Objekt zurück, das die dem canvas zugrunde liegenden Pixeldaten enthält. Die Methode wird auf einen bestimmten Ausschnitt des canvas angewendet, beginnend bei (sx, sy), mit Breite sw und Höhe sh.
CanvasRenderingContext2D.putImageData()
Malt Pixeldaten des ImageData Objekts auf das canvas. Wenn ein dreckiges Rechteck angegeben wird, werden nur die Pixel dieses Rechtecks gemalt.

Bildglättung

CanvasRenderingContext2D.imageSmoothingEnabled
Bildglättungsmodus; wenn deaktiviert, werden Bilder beim Skalieren nicht geglättet.

Der Leinwand-Zustand

Der CanvasRenderingContext2D-Renderkontext enthält eine Vielzahl an Zeichnungszuständen (Attribute für Linienstile, Füllstile, Schattenstile, Textstile). Die folgenden Methoden helfen Ihnen mit diesen Zuständen zu arbeiten:

CanvasRenderingContext2D.save()
Saves the current drawing style state using a stack so you can revert any change you make to it using restore().
CanvasRenderingContext2D.restore()
Restores the drawing style state to the last element on the 'state stack' saved by save().
CanvasRenderingContext2D.canvas
A read-only back-reference to the HTMLCanvasElement. Might be null if it is not associated with a <canvas> element.

Trefferregionen

CanvasRenderingContext2D.addHitRegion()
Fügt eine Trefferregion (hit region) zur Leinwand hinzu.
CanvasRenderingContext2D.removeHitRegion()
Entfernt eine Trefferregion mit gegebener id von der Leinwand.
CanvasRenderingContext2D.clearHitRegions()
Entfernt alle Trefferregionen von der Leinwand.

Filter

CanvasRenderingContext2D.filter
Applies a CSS or SVG filter to the canvas, e.g., to change its brightness or bluriness.

Unstandardisierte APIs

Die meisten dieser APIs sind veraltet und wurden kurz nach Chrome 36 entfernt.

CanvasRenderingContext2D.clearShadow()
Entfernt alle Schatteneinstellungen wie  CanvasRenderingContext2D.shadowColor und CanvasRenderingContext2D.shadowBlur.
CanvasRenderingContext2D.drawImageFromRect()
Das ist redundant zum equivalenten Überladung von  drawImage.
CanvasRenderingContext2D.setAlpha()
Verwenden Sie CanvasRenderingContext2D.globalAlpha anstelle dieser Methode.
CanvasRenderingContext2D.setCompositeOperation()
Verwenden Sie CanvasRenderingContext2D.globalCompositeOperation anstelle dieser Methode.
CanvasRenderingContext2D.setLineWidth()
Verwenden Sie CanvasRenderingContext2D.lineWidth anstelle dieser Methode.
CanvasRenderingContext2D.setLineJoin()
Verwenden Sie CanvasRenderingContext2D.lineJoin anstelle dieser Methode.
CanvasRenderingContext2D.setLineCap()
Verwenden Sie CanvasRenderingContext2D.lineCap anstelle dieser Methode.
CanvasRenderingContext2D.setMiterLimit()
Verwenden Sie CanvasRenderingContext2D.miterLimit anstelle dieser Methode.
CanvasRenderingContext2D.setStrokeColor()
Verwenden Sie CanvasRenderingContext2D.strokeStyle anstelle dieser Methode.
CanvasRenderingContext2D.setFillColor()
Verwenden Sie CanvasRenderingContext2D.fillStyle anstelle dieser Methode.
CanvasRenderingContext2D.setShadow()
Verwenden Sie CanvasRenderingContext2D.shadowColor und CanvasRenderingContext2D.shadowBlur anstelle dieser Methode.
CanvasRenderingContext2D.webkitLineDash
Verwenden Sie CanvasRenderingContext2D.getLineDash() und CanvasRenderingContext2D.setLineDash() anstelle dieser Methode.
CanvasRenderingContext2D.webkitLineDashOffset
Verwenden Sie CanvasRenderingContext2D.lineDashOffset anstelle dieser Methode.
  CanvasRenderingContext2D.webkitImageSmoothingEnabled
Verwenden Sie CanvasRenderingContext2D.imageSmoothingEnabled anstelle dieser Methode.
CanvasRenderingContext2D.getContextAttributes()
Inspired by the same WebGLRenderingContext method it returns an Canvas2DContextAttributes object that contains the attributes "storage" to indicate which storage is used ("persistent" by default) and the attribute "alpha" (true by default) to indicate that transparency is used in the canvas.
CanvasRenderingContext2D.isContextLost()
Inspired by the same WebGLRenderingContext method it returns true if the Canvas context has been lost, or false if not.

WebKit only

CanvasRenderingContext2D.webkitBackingStorePixelRatio
The backing store size in relation to the canvas element. See High DPI Canvas.
CanvasRenderingContext2D.webkitGetImageDataHD
Intended for HD backing stores, but removed from canvas specifications.
CanvasRenderingContext2D.webkitPutImageDataHD
Intended for HD backing stores, but removed from canvas specifications.

Gecko only

CanvasRenderingContext2D.filter
CSS and SVG filters as Canvas APIs. Likely to be standardized in a new version of the specification.

Prefixed APIs

CanvasRenderingContext2D.mozCurrentTransform
Sets or gets the current transformation matrix, see CanvasRenderingContext2D.currentTransform
CanvasRenderingContext2D.mozCurrentTransformInverse
Sets or gets the current inversed transformation matrix. 
CanvasRenderingContext2D.mozFillRule
The fill rule to use. This must be one of evenodd or nonzero (default).
CanvasRenderingContext2D.mozImageSmoothingEnabled
See CanvasRenderingContext2D.imageSmoothingEnabled.
CanvasRenderingContext2D.mozDash
An array which specifies the lengths of alternating dashes and gaps . Use CanvasRenderingContext2D.getLineDash() and CanvasRenderingContext2D.setLineDash() instead.
CanvasRenderingContext2D.mozDashOffset
Specifies where to start a dash array on a line. . Use CanvasRenderingContext2D.lineDashOffset instead.
CanvasRenderingContext2D.mozTextStyle
Introduced in in Gecko 1.9, deprecated in favor of the CanvasRenderingContext2D.font property.
CanvasRenderingContext2D.mozDrawText()
This method was introduced in Gecko 1.9 and is removed starting with Gecko 7.0. Use CanvasRenderingContext2D.strokeText() or CanvasRenderingContext2D.fillText() instead.
CanvasRenderingContext2D.mozMeasureText()
This method was introduced in Gecko 1.9 and is unimplemented starting with Gecko 7.0. Use CanvasRenderingContext2D.measureText() instead.
CanvasRenderingContext2D.mozPathText()
This method was introduced in Gecko 1.9 and is removed starting with Gecko 7.0.
CanvasRenderingContext2D.mozTextAlongPath()
This method was introduced in Gecko 1.9 and is removed starting with Gecko 7.0.

Internal APIs (chrome-context only)

CanvasRenderingContext2D.asyncDrawXULElement()
Renders a region of a XUL element into the canvas.
CanvasRenderingContext2D.drawWindow()
Renders a region of a window into the canvas. The contents of the window's viewport are rendered, ignoring viewport clipping and scrolling.
CanvasRenderingContext2D.demote()
This causes a context that is currently using a hardware-accelerated backend to fallback to a software one. All state should be preserved.

Internet Explorer

CanvasRenderingContext2D.msFillRule
The fill rule to use. This must be one of evenodd or nonzero (default).

Specifications

Specification Status Comment
HTML Living Standard
Die Definition von 'CanvasRenderingContext2D' in dieser Spezifikation.
Lebender Standard  

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid WebviewChrome für AndroidFirefox für AndroidOpera für AndroidSafari auf iOSSamsung Internet
CanvasRenderingContext2D
ExperimentellNicht standardisiert
Chrome Vollständige Unterstützung 1Edge Vollständige Unterstützung JaFirefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung 9Opera Vollständige Unterstützung 9Safari Vollständige Unterstützung 2WebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
addHitRegion
Experimentell
Chrome Vollständige Unterstützung Ja
Deaktiviert
Vollständige Unterstützung Ja
Deaktiviert
Deaktiviert This feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge ? Firefox Vollständige Unterstützung 30
Deaktiviert
Vollständige Unterstützung 30
Deaktiviert
Deaktiviert From version 30: this feature is behind the canvas.hitregions.enabled preference. To change preferences in Firefox, visit about:config.
IE Keine Unterstützung NeinOpera Keine Unterstützung NeinSafari Keine Unterstützung NeinWebView Android Keine Unterstützung NeinChrome Android Keine Unterstützung NeinFirefox Android Vollständige Unterstützung 30
Deaktiviert
Vollständige Unterstützung 30
Deaktiviert
Deaktiviert From version 30: this feature is behind the canvas.hitregions.enabled preference. To change preferences in Firefox, visit about:config.
Opera Android Keine Unterstützung NeinSafari iOS Keine Unterstützung NeinSamsung Internet Android Keine Unterstützung Nein
arcChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
arcToChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
beginPathChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
bezierCurveToChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
canvasChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
clearHitRegions
Experimentell
Chrome Vollständige Unterstützung Ja
Deaktiviert
Vollständige Unterstützung Ja
Deaktiviert
Deaktiviert This feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge ? Firefox Vollständige Unterstützung 38
Deaktiviert
Vollständige Unterstützung 38
Deaktiviert
Deaktiviert From version 38: this feature is behind the canvas.hitregions.enabled preference. To change preferences in Firefox, visit about:config.
IE Keine Unterstützung NeinOpera Keine Unterstützung NeinSafari Keine Unterstützung NeinWebView Android Keine Unterstützung NeinChrome Android Keine Unterstützung NeinFirefox Android Vollständige Unterstützung 38
Deaktiviert
Vollständige Unterstützung 38
Deaktiviert
Deaktiviert From version 38: this feature is behind the canvas.hitregions.enabled preference. To change preferences in Firefox, visit about:config.
Opera Android Keine Unterstützung NeinSafari iOS Keine Unterstützung NeinSamsung Internet Android Keine Unterstützung Nein
clearRectChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
clipChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
closePathChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
createImageDataChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 2IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
createLinearGradientChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
createPatternChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
createRadialGradientChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
currentTransform
Experimentell
Chrome Vollständige Unterstützung Ja
Deaktiviert
Vollständige Unterstützung Ja
Deaktiviert
Deaktiviert This feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge Vollständige Unterstützung JaFirefox Keine Unterstützung Nein
Hinweise
Keine Unterstützung Nein
Hinweise
Hinweise See bug 928150. Firefox also supports the experimental and prefixed properties mozCurrentTransform and mozCurrentTransformInverse which set or get the current (inverse) transformation matrix.
IE Keine Unterstützung NeinOpera Keine Unterstützung NeinSafari Keine Unterstützung Nein
Hinweise
Keine Unterstützung Nein
Hinweise
Hinweise See webkitbug(174278).
WebView Android Keine Unterstützung NeinChrome Android Keine Unterstützung NeinFirefox Android Keine Unterstützung NeinOpera Android Keine Unterstützung NeinSafari iOS Keine Unterstützung NeinSamsung Internet Android Keine Unterstützung Nein
direction
Experimentell
Chrome Vollständige Unterstützung Ja
Deaktiviert
Vollständige Unterstützung Ja
Deaktiviert
Deaktiviert This feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge ? Firefox Keine Unterstützung NeinIE Keine Unterstützung NeinOpera Keine Unterstützung NeinSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Keine Unterstützung NeinOpera Android Keine Unterstützung NeinSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
drawFocusIfNeededChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 14Firefox Vollständige Unterstützung 32
Vollständige Unterstützung 32
Vollständige Unterstützung 29
Deaktiviert
Deaktiviert From version 29: this feature is behind the canvas.focusring.enabled preference. To change preferences in Firefox, visit about:config.
Vollständige Unterstützung 28
Alternativer Name
Alternativer Name Verwendet den nicht standardisierten Namen: drawSystemFocusRing
IE Keine Unterstützung NeinOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 32
Vollständige Unterstützung 32
Vollständige Unterstützung 29
Deaktiviert
Deaktiviert From version 29: this feature is behind the canvas.focusring.enabled preference. To change preferences in Firefox, visit about:config.
Vollständige Unterstützung 28
Alternativer Name
Alternativer Name Verwendet den nicht standardisierten Namen: drawSystemFocusRing
Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
drawImageChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
drawWidgetAsOnScreen
Nicht standardisiert
Chrome Keine Unterstützung NeinEdge Keine Unterstützung NeinFirefox Vollständige Unterstützung 41IE Keine Unterstützung NeinOpera Keine Unterstützung NeinSafari Keine Unterstützung NeinWebView Android Keine Unterstützung NeinChrome Android Keine Unterstützung NeinFirefox Android Vollständige Unterstützung 41Opera Android Keine Unterstützung NeinSafari iOS Keine Unterstützung NeinSamsung Internet Android Keine Unterstützung Nein
drawWindow
Nicht standardisiert
Chrome Keine Unterstützung NeinEdge Keine Unterstützung NeinFirefox Vollständige Unterstützung 1.5IE Keine Unterstützung NeinOpera Keine Unterstützung NeinSafari Keine Unterstützung NeinWebView Android Keine Unterstützung NeinChrome Android Keine Unterstützung NeinFirefox Android Vollständige Unterstützung 4Opera Android Keine Unterstützung NeinSafari iOS Keine Unterstützung NeinSamsung Internet Android Keine Unterstützung Nein
ellipse
Experimentell
Chrome Vollständige Unterstützung 31Edge Vollständige Unterstützung 13Firefox Vollständige Unterstützung 48IE Keine Unterstützung NeinOpera Vollständige Unterstützung 18Safari Vollständige Unterstützung 9WebView Android Keine Unterstützung NeinChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung JaOpera Android Keine Unterstützung NeinSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
fillChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
fillRectChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
fillStyleChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
fillTextChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 3.5IE Vollständige Unterstützung 9Opera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
filter
Experimentell
Chrome Vollständige Unterstützung 52Edge ? Firefox Vollständige Unterstützung 49
Vollständige Unterstützung 49
Keine Unterstützung 35 — 48
Deaktiviert
Deaktiviert From version 35 until version 48 (exclusive): this feature is behind the canvas.filters.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Keine Unterstützung NeinOpera Keine Unterstützung NeinSafari Keine Unterstützung NeinWebView Android Vollständige Unterstützung 52Chrome Android Vollständige Unterstützung 52Firefox Android Vollständige Unterstützung 49
Vollständige Unterstützung 49
Keine Unterstützung 35 — 48
Deaktiviert
Deaktiviert From version 35 until version 48 (exclusive): this feature is behind the canvas.filters.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android Keine Unterstützung NeinSafari iOS Keine Unterstützung NeinSamsung Internet Android Vollständige Unterstützung 6.0
fontChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 3.5IE Vollständige Unterstützung 9Opera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
getImageDataChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung Ja
Vollständige Unterstützung Ja
Vollständige Unterstützung 5
Hinweise
Hinweise getImageData now correctly accepts rectangles that extend beyond the bounds of the canvas; pixels outside the canvas are returned as transparent black and now also returns at least one pixel's worth of image data if a rectangle smaller than one pixel is specified.
IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung Ja
Vollständige Unterstützung Ja
Vollständige Unterstützung 5
Hinweise
Hinweise getImageData now correctly accepts rectangles that extend beyond the bounds of the canvas; pixels outside the canvas are returned as transparent black and now also returns at least one pixel's worth of image data if a rectangle smaller than one pixel is specified.
Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
getLineDashChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 27IE Vollständige Unterstützung 11Opera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 27Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
globalAlphaChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
globalCompositeOperationChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
imageSmoothingEnabled
Experimentell
Chrome Vollständige Unterstützung 30
Vollständige Unterstützung 30
Keine Unterstützung ? — 30
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: webkit
Edge Vollständige Unterstützung 15Firefox Vollständige Unterstützung 51
Vollständige Unterstützung 51
Keine Unterstützung ? — 51
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: moz
IE Vollständige Unterstützung Ja
Mit Präfix
Vollständige Unterstützung Ja
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: ms
Opera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung 4.4Chrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 51
Vollständige Unterstützung 51
Keine Unterstützung ? — 51
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: moz
Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
imageSmoothingQuality
Experimentell
Chrome Vollständige Unterstützung 54Edge ? Firefox Keine Unterstützung NeinIE ? Opera Vollständige Unterstützung 41Safari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung 54Chrome Android Vollständige Unterstützung 54Firefox Android Keine Unterstützung NeinOpera Android Vollständige Unterstützung 41Safari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung 6.0
isPointInPathChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 2IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
isPointInStrokeChrome Vollständige Unterstützung JaEdge Keine Unterstützung NeinFirefox Vollständige Unterstützung 20
Vollständige Unterstützung 20
Keine Unterstützung 19 — 20
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: moz
IE Keine Unterstützung NeinOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 20
Vollständige Unterstützung 20
Keine Unterstützung 19 — 20
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: moz
Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
lineCapChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
lineDashOffsetChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 27
Vollständige Unterstützung 27
Vollständige Unterstützung 7
Alternativer Name
Alternativer Name Verwendet den nicht standardisierten Namen: mozDashOffset
IE Vollständige Unterstützung 11Opera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 27
Vollständige Unterstützung 27
Vollständige Unterstützung 7
Alternativer Name
Alternativer Name Verwendet den nicht standardisierten Namen: mozDashOffset
Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
lineJoinChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
lineToChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
lineWidthChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
measureTextChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 2IE Vollständige Unterstützung 9Opera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
miterLimitChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
moveToChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
putImageDataChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 2IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
quadraticCurveToChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
rectChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
removeHitRegion
Experimentell
Chrome Vollständige Unterstützung Ja
Deaktiviert
Vollständige Unterstützung Ja
Deaktiviert
Deaktiviert This feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge ? Firefox Vollständige Unterstützung 30
Deaktiviert
Vollständige Unterstützung 30
Deaktiviert
Deaktiviert From version 30: this feature is behind the canvas.hitregions.enabled preference. To change preferences in Firefox, visit about:config.
IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Keine Unterstützung NeinChrome Android Keine Unterstützung NeinFirefox Android Vollständige Unterstützung 30
Deaktiviert
Vollständige Unterstützung 30
Deaktiviert
Deaktiviert From version 30: this feature is behind the canvas.hitregions.enabled preference. To change preferences in Firefox, visit about:config.
Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Keine Unterstützung Nein
resetTransform
Experimentell
Chrome Vollständige Unterstützung 31Edge Keine Unterstützung NeinFirefox Vollständige Unterstützung 36IE Keine Unterstützung NeinOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 36Opera Android Keine Unterstützung NeinSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
restoreChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
rotateChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
saveChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
scaleChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
scrollPathIntoView
Experimentell
Chrome Vollständige Unterstützung Ja
Deaktiviert
Vollständige Unterstützung Ja
Deaktiviert
Deaktiviert This feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge ? Firefox Keine Unterstützung NeinIE Keine Unterstützung NeinOpera Vollständige Unterstützung JaSafari Keine Unterstützung NeinWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Keine Unterstützung NeinOpera Android Keine Unterstützung NeinSafari iOS Keine Unterstützung NeinSamsung Internet Android Vollständige Unterstützung Ja
setLineDashChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 27IE Vollständige Unterstützung 11Opera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 27Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
setTransformChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 3IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
shadowBlurChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
shadowColorChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
shadowOffsetXChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
shadowOffsetYChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
strokeChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
strokeRectChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
strokeStyleChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
strokeTextChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 3.5IE Vollständige Unterstützung 9Opera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung JaOpera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
textAlignChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 3.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
textBaselineChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 3.5IE Vollständige Unterstützung 9Opera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
transformChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 3IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
translateChrome Vollständige Unterstützung JaEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 1.5IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja

Legende

Vollständige Unterstützung  
Vollständige Unterstützung
Keine Unterstützung  
Keine Unterstützung
Kompatibilität unbekannt  
Kompatibilität unbekannt
Experimentell. Das Verhalten kann sich zukünftig ändern.
Experimentell. Das Verhalten kann sich zukünftig ändern.
Nicht standardisiert. Erwarte schlechte browserübergreifende Unterstützung.
Nicht standardisiert. Erwarte schlechte browserübergreifende Unterstützung.
Siehe Implementierungshinweise.
Siehe Implementierungshinweise.
Benutzer muss dieses Feature explizit aktivieren.
Benutzer muss dieses Feature explizit aktivieren.
Verwendet einen nicht standardisierten Namen.
Verwendet einen nicht standardisierten Namen.
Benötigt ein Herstellerpräfix oder einen anderen Namen zur Verwendung.
Benötigt ein Herstellerpräfix oder einen anderen Namen zur Verwendung.
  • Starting with Gecko 5.0 (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2), specifying invalid values are now silently ignored for the following methods and properties: translate(), transform(), rotate(), scale(), rect(), clearRect(), fillRect(), strokeRect(), lineTo(), moveTo(), quadraticCurveTo(), arc(), shadowOffsetX, shadowOffsetYshadowBlur.

See also