Convertir lienzo a imagen y abrir en una nueva ventana usando ruby on rails y javascript

Estoy bastante atrapado en este problema y espero que me puedan ayudar.Convertir lienzo a imagen y abrir en una nueva ventana usando ruby on rails y javascript

Lo que estoy tratando de lograr es al hacer clic en un enlace, botón o imagen, que parece más simple, convertir lienzo en imagen usando toDataURL. Después de eso, se abre una nueva ventana que contiene esta imagen.

¿Cómo paso la url de datos generada desde toDataURL a una nueva ventana usando ruby on rails?

Gracias de antemano.

Fuente

2011-03-23 Mich

En primer lugar, esto no tiene mucho que ver con Rails. Sin embargo, puedes usar Ruby para resolver este problema.

En primer lugar buscar el contenido del lienzo, como ya se está haciendo:

En este punto usted puede simplemente abrir una nueva ventana con Javascript y abrir la imagen directamente allí (sin interacción del servidor es necesario) :

var window = window.open(); 
window.document.write('<img src="'+dataURL+'"/>'); 

$('a.my-link').click(function(){ 
    open().document.write('<img src="'+dataURL+'"/>'); 
    return false; 
});

Aquí hay un pequeño violín para ilustrar esto: http://jsfiddle.net/XtUFt/

O puede enviar la cadena base64 pura a un servidor nd tiene su aplicación para crear una imagen real y utilizar un objeto de hacerla:

var base64 = dataURL.replace(/^data:image\/(png|jpg);base64,/, "") ; 
var window = window.open('http://www.yourapp.com/controller/action?base64='+base64);

Este es un ejemplo simplificado y asume una imagen pequeña muy. Si su imagen es de alguna manera más grande, tendrá que usar una solicitud 'post' porque su URL no transportará los datos ya que la cadena es simplemente demasiado larga.

Y en el servidor que puede utilizar para crear la imagen:

require 'base64' 
File.open('your/image/path/and/name.gif', 'wb') do|f| 
    f.write(Base64.decode64(params[:base64])) 
end

entonces es sólo una cuestión de la apertura de la imagen y la representación de una vista en consecuencia.

Fuente

2011-03-23 13:16:45 polarblau

Gracias por la pronta respuesta polarblau. Pero, ¿por qué el siguiente método sugerido en la publicación anterior abre una ventana que muestra el icono que indica que la página todavía se está cargando? var window = window.open(); window.document.write ("etiqueta de imagen con src = dataURL"); Mi objetivo principal es permitir al usuario guardar los gráficos que ve en el lienzo como una imagen. Después de ver la imagen del gráfico seleccionado que aparece en otra ventana, el usuario puede hacer clic con el botón derecho en la imagen para guardarla. Supongo que el método anterior es suficiente. Pero por favor corrígeme si me equivoco. Gracias de antemano. – Mich

He agregado un ejemplo sobre cómo podría hacer el enlace. Parece funcionar. Pero tienes razón: el ícono de carga no desaparece. Podría tratar de especificar los parámetros que toma la función 'window.open' y ver si eso ayuda. – polarblau

Gracias de nuevo por la pronta respuesta polarblau. Después de mucho google-ing, descubrí que tenemos que usar window.document.close(); después de escribir en la nueva ventana para indicar que hemos dejado de escribir en la ventana. Luego de agregar la función close(), el icono de carga desapareció una vez que se muestra la imagen. – Mich

llego tarde para esto, pero aquí es un trazador de líneas sucia rápida que resuelve esta pregunta:

window.open(document.getElementById("mycanvas").toDataURL());

Espero que esto ayude a alguien en un futuro próximo.

Fuente

2016-07-25 13:58:55 revobtz

Mi enfoque:

var dataURL = canvas.toDataURL("image/png"); 
var newTab = window.open(dataURL, 'Image'); 
newTab.focus();

Podría ser la ayuda a alguien en el futuro.

Fuente

2017-03-21 11:16:17 Hokusai

Convertir lienzo a imagen y abrir en una nueva ventana usando ruby ​​on rails y javascript

Respuesta

Cuestiones relacionadas

Convertir lienzo a imagen y abrir en una nueva ventana usando ruby on rails y javascript