Das Zeichnen von DOM-Elementen (SVGs als fremde Elemente) auf einer Zeichenfläche funktioniert in Internet Explorer nicht

Ich habe erfolgreich diese Technik verwendet, um Benutzer zu zeichnen Eingabe von DOM-Elementen (z. B. Eingabe- und Auswahlfelder) auf einer Arbeitsfläche und Bereitstellung als Bild.

Dies funktioniert in Chrome, Safari und Firefox, aber in Internet Explorer 11, bekomme ich den folgenden Fehler :

• XML5634: Für dieses Element existiert bereits ein Attribut mit demselben Namen. Zeile: 1, Spalte 242 , wenn ich die gesamte Seite, die ich habe, anwende entwickelt. Dieser Fehler wird angeblich angezeigt, wenn doppelte Werte für Name und ID-Felder vorhanden sind, aber ich habe jedes Element im DOM überprüft und es gibt keine.
• Unerwarteter Aufruf von Methoden- oder Eigenschaftenzugriff. Wenn ich versuche, den gesamten Vorgang auf dieser Geige zu reproduzieren: Ссылка . Es scheint von dem Debugger, dass der Fehler passiert, wenn ctx.drawImage() aufgerufen wird.

Im Wesentlichen versuche ich in dieser Geige das SVG-Bild mit dem gelben Kreis und ein von mir zur Verfügung gestelltes beliebiges SVG auf der Leinwand zu zeichnen . Dies scheint in allen gängigen Browsern außer IE11 zu funktionieren. Gibt es noch jemanden, der das gleiche Problem hat und eine Umgehungslösung kennt?