Html2canvas: no admite la propiedad de familia de fuentes con valor múltiple
Usando 0.5.0-beta4, ¡muchas gracias por este gran módulo!
El problema que tengo es, digamos que tengo una clase
.class {
font-family: "somefont", "Arial"
}
donde no se aplica "somefont", el resultado final es que los elementos que son .class se renderizarían usando Arial en la página, pero en el lienzo se aplica la fuente predeterminada en su lugar.
¿Alguna idea?
rayax86
Todos 7 comentarios
Tengo el mismo problema.
Esta es la fuente Roboto, en Google Chrome Canary
Esta es una imagen renderizada
eZ0
en 18 feb. 2016
Encontré la razón: el padre del lienzo debe tener una declaración de fuente explícita como esta:
.container {
font-family: Roboto, "Helvetica Neue", sans-serif;
}
eZ0
en 18 feb. 2016
La unión / división en CanvasRenderer.prototype.font estaba eliminando fuentes adicionales. Envié una solución
jordan314
en 12 may. 2016
No estoy seguro de si esto está relacionado, pero aquí creo que estoy viendo la fuente representada correctamente, pero luego se superpone con una fuente errónea.
rsbondi
en 13 jun. 2016
@ eZ0 tienes razón! ¡Gracias!
Como dijiste, puse font-family: arial en el elemento principal del lienzo y funciona.
¡Gracias! ¡Gracias!
getJv
en 28 sept. 2016
Debe corregirse en https://github.com/niklasvh/html2canvas/commit/77d258f1d8eeccf7e38235463a293b512c1ca3d0
niklasvh
en 12 dic. 2017
no funciona, tengo el mismo error
prestado por
html2canvas(this.$refs.iFr, { useCORS: true }).then(canvas => {
console.log(canvas)
document.body.appendChild(canvas)
canvas.toBlob(function(blob) {
saveAs(blob, 'Dashboard.png')
})
})
Las fuentes cargadas personalizadas desde el servidor (no CORS) no se procesan. Se usó un archivo CSS basado en fuentes 64 como fuente-face para Liberation Serif
ruslankonev
en 9 oct. 2018
Temas relacionados
diego-rey
·
3Comentarios
ABHIKSINGHH
·
3Comentarios
kunal886496
·
3Comentarios
tibewww
·
4Comentarios
Juliazhong
·
4Comentarios
Comentario más útil
Encontré la razón: el padre del lienzo debe tener una declaración de fuente explícita como esta:
.container { font-family: Roboto, "Helvetica Neue", sans-serif; }