Pregunta

Por lo tanto, necesito guardar los datos de imagen dibujados en un elemento <canvas>. Y existe el método toDataURL () que funciona en la mayoría de los navegadores modernos.

Excepto ... lo adivinaste ... Internet Explorer.

He buscado en Internet, pero en todas partes la gente dice que debería usar SVG / VML para guardar los datos, pero nunca mencionan cómo. No tengo ninguna experiencia con SVG / VML en IE, entonces, ¿cómo guardo la imagen dibujada en un elemento de lienzo en Internet Explorer? ¿Alguien tiene experiencia?

Por el momento, tuve que duplicar el código de dibujo tanto en el cliente como en el servidor, lo que está empezando a complicarse. Entonces, si hay una manera de extraer la imagen dibujada en la etiqueta del lienzo en el lado del cliente (o servidor) que sin duda ayudaría.

¡Gracias!

¿Fue útil?

Solución

Es posible que pueda obtener el VML y lo mismo, pero ese es un formato XML, por lo que probablemente no sea lo que desea. No hay forma de obtener una imagen de IE sin usar un complemento.

Otros consejos

  1. canvas.toDataURL funciona en IE9.

  2. Si realmente lo necesitas para un IE antiguo ... bueno ... te daré una cita

  

toDataURL no será compatible debido a la naturaleza del método utilizado por   Explorer Canvas: VML. No encontramos una manera de rasterizar VML a mapa de bits   imágenes usando JS, y ni siquiera con un script del lado del servidor. Así que si usted   Realmente necesitoDataURL en IE, tendrás que usar FxCanvas   (http://code.google.com/p/fxcanvas/) o FlashCanvas   (http://flashcanvas.net/): dos soluciones basadas en Flash.

http://code.google.com/p/explorercanvas/ cuestiones / detalles? id = 77

Tuve el mismo problema. Lo que quería hacer era convertir el lienzo en una imagen, luego abrirlo en una nueva pestaña. Descubrí que convertirlo no era el problema, pero abrirlo en un nuevo enlace sí. Lo resolví generando la imagen, colocándola en una etiqueta img y luego incluyéndola en la nueva página. Luego abrí dicha nueva página usando este tutorial - http://www.javascripter.net/faq/writingt .htm

Esto es lo que hice

var canvas = document.getElementById('canvas1');
var dataURL = canvas.toDataURL();
var width = parseInt($("#main").width()); //main is the div that contains my canvas
var height = parseInt($("#main").height());
newWindow("<img src=\"" + dataURL + "\"/>");
function newWindow(content) {
    top.consoleRef = window.open("", "Organisational Structure",
        "width="+width+",height="+height
        + ",menubar=0"
        + ",toolbar=1"
        + ",status=0"
        + ",scrollbars=1"
        + ",resizable=1")
    top.consoleRef.document.writeln(
        "<html><head><title>Console</title></head>"
        + "<body bgcolor=white onLoad=\"self.focus()\">"
        + content
        + "</body></html>"
    )
    top.consoleRef.document.close()
}
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top