Pin colorati e con testo dinamico su Umap
E’ un post tecnico ma sintetico.
Ho avuto la necessità di collegare un database dinamico ad Umap. Ci sono dei valori di rilevazione di polveri sottili che cambiano e volevo mostrare già con uno sguardo d’insieme nella mappa fatta su Umap quali erano i luoghi con PIN di colore Rosso, Verde e Arancione e , in aggiunta, il valore numerico dell’ultimo dato rilevato , già nel PIN stesso.
Insomma una cosa come questa che feci ormai tanti anni fa per i Terremoti:
Su UMAP, nel caso di GeoJson statici, la cosa si può attuare come ci ha spiegato molto ben Vitrano in questo ottimo post.
Dopo aver cercato per un po’ ho deciso di fare uno script che passa dal mio server e poi risponde con una png con dentro il testo. Il concetto è questo: la tabella del db dinamico ha 2 campi che ci interessano. Sono il valore da visualizzare nel PIN e , grazie ad una semplice formula, un nome di un file PNG che avrete preventivamente creato. Io li ho chiamati rosso.png verde.png arancio.png e sono 3 cerchi in pratica.
In UMAP, nelle shape properties dell’icona, mettete campi personalizzati e nell’URL –> http://vostrosito/color.php?Ultima_rilev={Ultima_rilev}&Color={Pin}
L’effetto finale sarà:
Non mi resta che postarvi il codice. Ricordatevi che il campo Pin deve avere solo il nome del file png che deve essere presente nella stessa dir in cui mettete il color.php:
<?php
function h($data,$encoding=’UTF-8′)
{
return htmlspecialchars($data,ENT_QUOTES | ENT_HTML401,$encoding);
}
$text=h($_GET[“Ultima_rilev”]);
$arrText=explode(“\n”,wordwrap($text,10,”\n”));
$im = @imagecreatefrompng(h($_GET[“Color”])); //creates an image
$background_color = imagecolorallocate($im, 255,255,255); //sets image background color
$y=17; //vertical position of text
foreach($arrText as $arr)
{
$white=imagecolorallocate($im,0,0,0); //sets text color
imagestring($im,6,6,$y,trim($arr),$white); //create the text string for image,added trim() to remove unwanted chars
$y=$y+7;
}
header(“Content-type: image/png”);
imagepng($im);
imagedestroy($im);
?>
