rappresentazione grafica di un punteggio

Ciao

Vorrei rappresentare graficamente un punteggio, in pratica un barra che si colora progressivamente in base ad un valore (da 1 a 10 per esempio) presente magari in un campo DB.

una cosa del genere (che ho visto in un forum):

http://xs.to/image-08A5_4B94FE84.jpg

Dove la figura sopra si riempi del colore rosso in base al punteggio (o avvertimenti avuti, come penso nel caso del forum dal quale ho prelevato l'immagine di cui sopra), 0 barra bianca, 5 colorata a metà, 10 completamente rossa;
oppure ancora più simpaticamente (nel caso degli avvertimenti subiti che conto di implementare in un mio lavoro)
con più colori che vadano dal verde (pochi avvisi) al giallo fino al rosso.

Mi potete aiutare?

Grazie

Dunque, non è complicato. Ci sono due sistemi. Uno è di usare tre immagini: verde.jpg, giallo.jpg e rosso.jpg. Praticamente se il numero degli avvertimenti totali è 3 (ad esempio), le immagini saranno verdi, visualizzate con un ciclo for. Da 3 a 7 saranno gialle, e da 7 a 10 saranno rosse. Se non hai capito dimmelo che ti scrivo un piccolo script!

http://blog.leetsoft.com/2006/8/22/s...imple-css-bars

Poi con php metti tanti begli If (o controlli di altro genere come switch):

Codice PHP:

---

<div class="progress-container">
<?php
$val= "5" //valori da 1 a 10
if(($val > 0)&($val<5)){
echo "<div style=\"width: {$val}0%; background: green\"></div>";
}
if(($val > 4)&($val<9)){
echo "<div style=\"width: {$val}0%; background: orange\"></div>";
}
if(($val > 9)){
echo "<div style=\"width: {$val}0%; background: red\"></div>";
}
?>
</div>

---

Oppure se vuoi fare il figo puoi usare direttamente le api di google per generare qualcosa del genere:
http://chart.apis.google.com/chart?c...=Quasi+bannato

Citazione:

---

Originalmente inviato da binarysun

Oppure se vuoi fare il figo puoi usare direttamente le api di google per generare qualcosa del genere:
http://chart.apis.google.com/chart?c...=Quasi+bannato

---

dove le trovo queste api di google?

http://code.google.com/intl/it/apis/charttools/

Scusate l'intromisione ma binary per fare qualcosa del genere, qualcosa di semplice come posso fare? ho visto le api di google ma non ho capito un gran che...

Qualcosa cosi..

Qualcuno ha fatto delle classi apposite per gestire.
MA in soldoni basta editare l'url
L'immagine che ho postato sopra ha questa url
http://chart.apis.google.com/chart?c...=Quasi+bannato
dove
chs = Dimensioni
cht = tipo di grafico
chd = gradi della freccia
chl = il testo

Ovviamente poi guardando la documentazione delle api si possono modificare cose.

preferisco fare tutto con il php

Infatti, come specificato da binarysun, esistono delle classi in PHP che automatizzano l'utilizzo delle API di Google. Quindi praticamente la classe fa da intermediario tra il server e l'API, e consente di passare parametri direttamente nello script, anziché facendo la richiesta manualmente. Comunque esistono anche alcune valide classi per la creazione di grafici con le librerie GD che semplificano molto il lavoro.

Citazione:

---

Originalmente inviato da comunitavirtuali

http://blog.leetsoft.com/2006/8/22/s...imple-css-bars

Poi con php metti tanti begli If (o controlli di altro genere come switch):

Codice PHP:

---

<div class="progress-container">
<?php
$val= "5" //valori da 1 a 10
if(($val > 0)&($val<5)){
echo "<div style=\"width: {$val}0%; background: green\"></div>";
}
if(($val > 4)&($val<9)){
echo "<div style=\"width: {$val}0%; background: orange\"></div>";
}
if(($val > 9)){
echo "<div style=\"width: {$val}0%; background: red\"></div>";
}
?>
</div>

---

---

molte semplice da utilizzare. Probabilmente userò questa soluzione. Avrei preferito che la barra avesse avuto più colori per i valori alti. Per esempio nel caso di 95% la prima parte verde poi verso la metà gialla e l'ultimo pezzo rosso.
Grazie


x alessandro1997

mi piacerebbe imparare ad utilizzare le api di google ma non ci ho capito niente:oops::oops::lol:

ciao