El diario de Pepe Molina (Caricatos)
Durante la escritura de los apuntes, hay veces que he necesitado obtener un determinado color de una imagen y para esos casos lo que creo que es de uso más habitual es el "cuentagotas" de los editores gráficos.
Última caricatura
IV Asamblea de la AEC: IV Asamblea General de la Asociación Española de Caricaturistas
RSS de las imágenes: 
La Cita
La imaginación es más importante que el conocimiento
Albert Einstein, físico y matemático (1879-1955).
En esta zona están las páginas personales del autor.
Mis Enlaces
Mis clientes ahora también son mis amigos (aunque les cobre).
Mis Clientes
En Mis amigos Informáticos hay una pequeña colección de páginas de colegas webmasters..
Mis Amigos Informáticos
En Mis amigos artistas podemos encontrar artistas de cualquier índole (dibujantes, pintores, escritores...)
Mis Amigos Artistas
Las recomendaciones que proponemos son de índole variada.
Mis recomendaciones
Aquí un cajón de sastre de enlaces.
Interés General
Nos referencian desde sitios de toda índole.
Referencias externas
Puede contribuir a mantener esta página con su donativo.
Paleta de colores desde imagen
Publicado el día 23 de agosto de 2011
Durante la escritura de los apuntes, hay veces que he necesitado obtener un determinado color de una imagen y para esos casos lo que creo que es de uso más habitual es el "cuentagotas" de los editores gráficos. Vamos a plantear la posibilidad de obtener esa paleta desde un sencillo formulario de una página web (ésta, por ejemplo).
Vamos a intentar evitar un mal uso del recurso que proponemos limitando el tamaño de la imagen, y también limitaremos el número de colores, ya que una imagen muy pequeña de 100 x 100 puntos, puede tener una paleta de 10000 colores distintos (cada punto de un color diferente).
Una medida adecuada a todo *
Debemos pensar en una limitación en el tamaño de la imagen para no necesitar configuraciones especiales, y debido a la velocidad normal actual de transferencia de datos en Internet, en principio limitaremos el tamaño a 800 puntos en el mayor de los lados de la imagen; pero en el servidor la redimensionaremos a 200 puntos.
Necesitamos entonces un formulario normal con las condiciones obligatorias para adjuntar ficheros, y al no ser posible con Ajax (el objeto XMLHttpRequest) tendremos que tener un iframe oculto (o no). También necesitaremos una función que reciba el listado de colores y los muestre, pero cuando no se encuentre en la página (solo debe existir para el presente apunte), nos indique el número de colores obtenidos. O sea, debemos hacer uso de nuestro comodín.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>
http://www.caricatos.net/probador
</title>
<script type="text/javascript">
txt = new Array();
function tag(id) {return document.getElementById(id);}
function gris(n) {
r = n.toString(16).toUpperCase();
rr = (r.length == 1) ? "0" + r:r;
return rr + rr + rr;
}
window.onload = function() {
for (i = 0; i < 256; i++)
txt.push("\t\t\t<div id="color_" + i + "" style="background-color: #" + gris(i) + "" title="" + gris(i) + ""></div>");
tag("codes").innerHTML = txt.join("\n");
}
</script>
</head>
<body>
<textarea id="codes" style="width: 100%; height: 600px"></textarea>
</body>
</html>
Hemos comprobado que todo funciona correctamente, y podríamos incluir más controles como para poner el fondo seleccionado en distintas partes de la página, pero sobrecargaríamos de contenido el apunte innecesariamente, así que simplemente terminaremos aquí el mismo.
La recepción
Aunque todos los extras de este diario pueden verse en el editor del mismo, lo insertaremos a continuación.
function dec_hex($color) {
$c = dechex($color);
if (strlen($c) == 1) $c = "0$c";
return strtoupper($c);
}
$tipo = $_FILES["paletera"]["type"];
$vale = substr($tipo, 0, 6) == "image/";
if ($vale) {
$paletera = $_FILES["paletera"]["tmp_name"];
list($ancho, $alto) = @getimagesize($paletera);
if ($ancho > 800 || $alto > 800) {
$error = 1;
$colores = array("000000");
}
else {
$apaisada = $ancho > $alto;
$anchito = ($apaisada) ? 200: (int) (200 / $alto * $ancho);
$altito = ($apaisada) ? (int) (200 / $ancho * $alto): 200;
$peque = imagecreatetruecolor($anchito, $altito);
$paletera = imagecreatefromstring(file_get_contents($paletera));
ob_start();
imagegif($paletera);
$paletita = ob_get_clean();
$paletita = imagecreatefromstring($paletita);
imagecopyresampled($peque, $paletita, 0, 0, 0, 0, $anchito, $altito, $ancho, $alto);
$colores = array();
for ($i = 0; $i < $anchito; $i++)
for ($j = 0; $j < $altito; $j++) {
$c = imagecolorsforindex($paletita, imagecolorat($paletita, $i, $j));
$cc = dec_hex($c["red"]).dec_hex($c["green"]).dec_hex($c["blue"]);
if (!in_array($cc, $colores)) array_push($colores, $cc);
}
$error = 2;
}
}
else {
$error = 0;
$colores = array("000000");
}
$n = count($colores);
$mensaje_error = array("no es imagen", "tamaño inadecuado", "Ok");
$body = "Estado transacción: ".$mensaje_error[$error]."<br/>Colores encontrados: $n";
$js = "window.onload = function()\t{\n\tif (parent.mostrarPaleta)\tparent.mostrarPaleta(colores);\n\telse\talert(\"Colores: $n\n" + colores);\n}
\ncolores = [\"".implode("\",\n\"", $colores)."\"];\n";
Nótese que la inicialización javascript ($js) en la recepción contempla un caso "else" si no existiese la función "parent.mostrarPaleta", que teóricamente nunca se ejecutará, pero supongo que servirá como "caso de estudio" (bastaría con añadir un botón tipo submit para que fuese útil).
Zona de comentarios
Este apunte aún no tiene comentarios.
Evaluación
Valoración de esta página: (apunte.37)
Historial de navegación
Esta página ha sido visitada en 7663 ocasiones
Disponemos de rss
Y del Mapa del sitio, además del sitemap.xml.
Aquí podemos encontrar los apuntes más visitados.
Top 10 
"Top 10" reemplaza a la sección Últimos apuntes.
Una buena forma de buscar un apunte es a partir de su categoría.
Categorías (11)
- Caricatos (20)
- Así se hizo (41)
- Vicisitudes de un Webmaster (136)
- Mentes pensantes (9)
- Eventos y efemérides (9)
- Globalización (66)
- Mamarrachadas (6)
- Artes y oficios (12)
- Programación (112)
- Caricaturas y caricaturistas (15)
- Experiencias SEO (11)
También es posible buscar apuntes por medio de las etiquetas (tags).
Etiquetas
Hemos decidido poner al alcance de todos algunos comodines.
Extras
- listado de caricaturas
- listado de imágenes
- listado de extras
- listado de categorías
- listado de etiquetas
- listado de postales
- grupos de apuntes
- buscador interno
- anuario 2010
- anuario 2011
- anuario 2012
- anuario 2013
- anuario 2014
- anuario 2015
- anuario 2016
- anuario 2017
- anuario 2018
- anuario 2019
- anuario 2020
- anuario 2021
- anuario 2022
- anuario 2023
- anuario 2024
Adjuntamos una versión reducida del "buscador interno" que vemos en la lista anterior:
También estamos recopilando antiguas páginas del sitio.
Otras páginas del dominio
Desde este recuadro se puede hacer una búsqueda cronológica.
Archivos
- 2017 (7)
- 2016 (2)
- 2015 (6)
- 2014 (12)
- 2013 (20)
- diciembre (2)
- noviembre (1)
- octubre (1)
- septiembre (1)
- agosto (1)
- junio (1)
- mayo (2)
- abril (2)
- marzo (1)
- febrero (3)
- enero (5)
- 2012 (45)
- diciembre (3)
- noviembre (6)
- octubre (2)
- septiembre (4)
- agosto (2)
- julio (2)
- junio (3)
- mayo (4)
- abril (3)
- marzo (6)
- febrero (5)
- enero (5)
- 2011 (62)
- diciembre (5)
- noviembre (9)
- octubre (6)
- septiembre (6)
- agosto (3)
- julio (2)
- junio (5)
- mayo (4)
- abril (2)
- marzo (5)
- febrero (7)
- enero (8)
- 2010 (1)
Se puede crear una postal nueva desde el enlace del sector "Otras páginas del dominio", o editar la que sale en el recuadro, pulsando sobre ella..
