Hace unos meses me encontré con el problema de tener que realizar
páginas HTML de texto puro sin poder incrustar imágenes.
Sin embargo, había que insertar un pequeño logotipo del cliente.
El problema puede resolverse convirtiendo la imagen del logotipo en una
gran tabla HTML de celdas de tamaño de 1 pixel por 1 pixel y cada una
del color de fondo de su pixel asociado.
En la imagen de este post puede verse el logotipo en imagen PNG,
en este caso de ejemplo mi propio logotipo, no el del cliente, y
abajo la misma imagen como tabla.
Como para esta publicación no he utilizado el logotipo original de la
empresa que me lo encargó, sino el mio, y para simplificar el ejemplo
sólo he utilizado 3 colores en la tabla,
es por eso que se nota el pixelado.
Pero si se usan más colores el resultado puede se muy parecido al
logotipo original en imagen.
En estos casos, y limitándome a 16 colores, suelo convertir las imágenes
en formato BMP (bitmap) a especificaciones en texto utilizando el
conversor
Bmp2Ico
realizado por Juan Ramón Miráz y por mi.
Incluyo dos realizaciones del mismo código fuente:
con CSS sólo para la página y con CSS para las celdas de la tabla
por lo que el tamaño del código a 1/3.
Como página HTML de resultado sólo incluyo en el PDF la última,
por ser más reducida.
A continuación se muestra parte del código TOL utilizado para esta
conversión, aunque reducido en la parte del mapa de letras del
logotipo para no saturar el post.
En el código PDF que se adjunta a este post se puede ver el código
fuente completo.
Set repTab =
[[
[["+", "<td class='r'></td>"]],
[[".", "<td class='b'></td>"]],
[["-", "<td class='s'></td>"]]
]];
Set picSet = [[
"+++++++-..................++++++++++++++++++++++++++++++++++",
"++++++-................+++++++++++++++++++++++++++++++++++++",
"++++++-...............++++++++++++++++++++++++++++++++++++++",
"+++++-..............++++++++++++++++++++++++++++++++++++++++",
... recortado ...
"++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++"
]];
Set repCic = EvalSet(picSet, Text(Text lin)
{ // Replace 1 time
" <tr>\n "+ReplaceTable(lin, repTab, 1)+"\n </tr>\n"
});
Text outHtm =
"
<html>
<head>
<style type='text/css'>
body { margin: 20px 20px 20px 20px; background-color: #ffffff; }
td.b { width: 1px; height: 1px; background-color: #ffffff; }
td.r { width: 1px; height: 1px; background-color: #ff0000; }
td.s { width: 1px; height: 1px; background-color: #ff9090; }
</style>
<title>Imagen en tabla</title>
</head>
<body>
<img src='logo.bmp'>
<br>
<br>
<br>
<table bgcolor='+ffffff' cellpadding=0 cellspacing=0 border=0>
"+
BinGroup("+",repCic)+
"
</table>
</body>
</html>
";
Text WriteFile("logocss.htm", outHtm);
