[PHP] Aggiungere watermark a grafico Google Charts

[baumer]

Preciso fin da ora che sono un neofita e che quindi a voi è probabile che il problema risulti banale, ma per me non lo è di certo stato.

Vorrei aggiungere un'immagine come watermark su di un grafico generato tramite le Api di Google Charts; la creazione del grafico avviene tramite la compilazione di un form che invia con la procedura GET i dati a Google.

L'immagine risultante è un PNG sul quale vorrei applicare la filigrana; ora, la creazione è stata abbastanza semplice, mentre quest'ulteriore modifica meno. Vorrei utilizzare le librerie GD incluse nella mia installazione.

Vi chiederei quindi qualche consiglio su come operare; per creare il grafico ho utilizzato un "img src" che come link ha l'indirizzo di Google al quale vengono aggiunte le variabili in coda, ma come posso fare per lavorare sul file PNG che mi viene restituito? Aggiungere la filigrana ad un'immagine già presente sul mio server è una cosa che ho già realizzato, ma non sono riuscito ad applicare la stessa procedura a questa nuova situazione.

Ho tentato inserendo come argomento in imagecreatefrompng l'url di google comprese le variabili che avevo precedentemente utilizzato nell'img src, ma senza successo; mi potreste indicare la sintassi corretta?

Grazie a chi mi vorrà aiutare.

[kk3z]

Codice PHP:

<?
$charturl = "http://chart.apis.google.com/chart?cht=p3&chd=t:60,40&chs=250x100&chl=Hello|World";
$image = file_get_contents($charturl);
$imagehandle = imagecreatefromstring($image);
$imagewidth = imagesx($imagehandle);
$imageheight = imagesy($imagehandle);

$watermark = "watermark.png";
$watermarkhandle = imagecreatefrompng($watermark);
$watermarkwidth = imagesx($watermarkhandle);
$watermarkheight = imagesy($watermarkhandle);

//Con queste coordinate lo metto in basso a destra
imagecopy($imagehandle, $watermarkhandle, $imagewidth-$watermarkwidth, $imageheight-$watermarkheight, 0,0, $watermarkwidth, $watermarkheight);

header("Content-Type: image/png");
imagepng($imagehandle);
?>

[baumer]

Ti ringrazio molto per avermi risposto; la struttura che mi suggerisci è la stessa che ho impiegato io, ma il problema riguarda il fatto che i parametri inviati a google tramite la stringa:

Codice PHP:

$charturl = "http://chart.apis.google.com/chart?cht=p3&chd=t:60,40&chs=250x100&chl=Hello|World"; 


contengono dati preimpostati, nella mia situazione invece questi dati vengono dinamicamente caricati da un form; quale sarebbe la sintassi corretta per sostituire dimensioni, nomi e testo con delle variabile da me scelte?

Il mio tentativo è stato:

Codice PHP:

$charturl = "http://chart.apis.google.com/chart?cht=p3&chd=t:<?php echo $percentuali ?>&chs=<?php echo $dimensioni ?>&chl=<?php echo $nomi ?>";

Grazie.

[kk3z]

Stai già scrivendo codice php, quindi perchè riapri di nuovo i tag?

Codice PHP:

$charturl = sprintf("http://chart.apis.google.com/chart?cht=p3&chd=t:%s&chs=%s&chl=%s", $percentuali, $dimensioni, $nomi); 


Visto che ci siamo ti mostro anche come farlo. Poi aggiungi i campi di cui hai bisogno:

Codice PHP:

<?
$charturl = sprintf("http://chart.apis.google.com/chart?cht=p3&chd=t:%s&chs=%s&chl=%s", 
    $_GET['percentuali'], $_GET['dimensioni'], $_GET['nomi']);
$image = file_get_contents($charturl);
$imagehandle = imagecreatefromstring($image);
$imagewidth = imagesx($imagehandle);
$imageheight = imagesy($imagehandle);

$watermark = "watermark.png";
$watermarkhandle = imagecreatefrompng($watermark);
$watermarkwidth = imagesx($watermarkhandle);
$watermarkheight = imagesy($watermarkhandle);

//Con queste coordinate lo metto in basso a destra
imagecopy($imagehandle, $watermarkhandle, $imagewidth-$watermarkwidth, $imageheight-$watermarkheight, 0,0, $watermarkwidth, $watermarkheight);

header("Content-Type: image/png");
imagepng($imagehandle);
?>

Metti questo codice in un file php che chiami chart.php.

Ed ecco il form html:

<script type="text/javascript">
   function CreateChart(form)
   {
      var percentuale = escape(form.percentuale.value);
      var dimensioni = escape(form.dimensioni .value);
      var nomi = escape(form.nomi.value);
      
      var img = document.getElementById("chart");
      img.src = "chart.php?percentuale="+percentuale+"&dimensioni="+dimensioni+"&nomi="+nomi;
      
      return false;
   }
</script>

<img id="chart">
<form onsubmit="return CreateChart(this)">
<input type="text" name="percentuale">
<input type="text" name="dimensioni">
<input type="text" name="nomi">
</form>

[baumer]

Colgo l'occasione di ringraziare kk3z per la sua disponibilità; mi trovo in ulteriore difficoltà, vorrei sfruttare l'api di google charts per creare un codice qr, contenente una sola stringa di testo che proviene però da un form a più campi, al quale poi applicare un immagine png come watermark. Ho fatto un po' di prove, ma senza successo; mi sono basato sull'esempio postato, effettuando le modifiche che più mi sembravano adeguate. Grazie a chi vorrà rispondere.

[..::DAVE::..]

Originariamente inviato da baumer

Colgo l'occasione di ringraziare kk3z per la sua disponibilità; mi trovo in ulteriore difficoltà, vorrei sfruttare l'api di google charts per creare un codice qr, contenente una sola stringa di testo che proviene però da un form a più campi, al quale poi applicare un immagine png come watermark. Ho fatto un po' di prove, ma senza successo; mi sono basato sull'esempio postato, effettuando le modifiche che più mi sembravano adeguate. Grazie a chi vorrà rispondere.

qrcode + watermark vanno poco d'accordo

[baumer]

Originariamente inviato da ..::DAVE::..

qrcode + watermark vanno poco d'accordo

Se ti riferisci al fatto che un'eventuale filigrana possa rendere difficoltosa la lettura, ti dico che la mia intenzione era quella di applicare con un watermark una cornice attorno al codice qr, in modo da non interferire. Altrimenti che cosa intendevi?