Lave en søjlediagram

du kan jo lege lidt med tabeller... så sætte height='$var1' også videre.... ved ikk om du forstår hvad jeg mener?

Det vil da være meget lettere at lave med div ..

<?
echo "
<div style=\"background-color: #000000; color: #ffffff; width: $var1;\">$var1</div>
<div style=\"background-color: #000000; color: #ffffff; width: $var2;\">$var2</div>
<div style=\"background-color: #000000; color: #ffffff; width: $var3;\">$var3</div>
";
?>

Så skriver den også tallet oven på ... Denne ligger ned.. Men du kan vel selv lige rette den til, hvis den skal stå op med noget float: left, float: right og height: $var[nummer]

/Nicklas B.

har lige lavet et ekstemt hurtigt eksempel, så du kan se, hvor enkelt let det er.. Og hvor lidt kode der skal til :)
http://www.bornstein.dk/diagram.php

og så har jeg også lige sat den lodrette på.. :)

nicklasb > Det er ret smart. Men hvis du ens tal er ret høje.. Hvad gør man så? Dividerer tallet med 100 først eller sådan noget?

Nogen idéer?

Men dit forslag er rigtigt godt synes jeg.

nicklasb > Den var smart, den havde jeg ikke tænkt på ;o) Vil bruge den selv, hvis jeg skal lave søjlediagrammer på et tidsounkt.

dank > ja du kan godt dividere med eksempelvis 100. Men du skal huske at dividere med det samme tal på alle dine søjler. :o)

Mvh.
Gonza

Hvad med den her klasse? http://ykcee.sourceforge.net/

Virker fino for mig...

ja.. det vil da nok være en smart måde at gøre det på.. Og hvis du prøver at kigge på min kan du måske også gennemskue at det faktisk er det jeg har gjodt ;)
Jeg har bare ganget i stedet..
Det du ser der nu ser således ud:

---------------kode---------------
<?
$een = "10";
$var1 = 20;
$var2 = 40;
$var3 = 35;
$var1dia = $var1*$een;
$var2dia = $var2*$een;
$var3dia = $var3*$een;
echo "
<div style=\"background-color: #000000; color: #ffffff; width: $var1dia; border: solid 1px #ffffff;\">$var1</div>
<div style=\"background-color: #000000; color: #ffffff; width: $var2dia; border: solid 1px #ffffff;\">$var2</div>
<div style=\"background-color: #000000; color: #ffffff; width: $var3dia; border: solid 1px #ffffff;\">$var3</div>
<p></p>
";

echo "
<div style=\"float: left; background-color: #000000; color: #ffffff; height: $var1dia; border: solid 1px #ffffff;\">$var1</div>
<div style=\"float: left; background-color: #000000; color: #ffffff; height: $var2dia; border: solid 1px #ffffff;\">$var2</div>
<div style=\"float: left; background-color: #000000; color: #ffffff; height: $var3dia; border: solid 1px #ffffff;\">$var3</div>
";
?>
--------------/kode---------------

Så ændre du bare på $een... Og den vil så ændre søjlernes længder.. Meget meget simpelt.. Og hvis det så er fordi dine tal er alt for høje, kan du jo bare gange det med noget under nul.. Altså fx 0,1.. Det vil svare til at dividere det med 10.. Så du skal slet ikke ændre i det, eller noget.. Du kan bare huske, at komma skal skrives med et punktum (.) i de fleste php-versioner.. Så kører den bare..

Du kunne jo også lave en script der ser hvor meget den højeste værdi er.. Og så ganger dem alle med en eller anden, anden værdi for at få en præcis maxlængde.. Det var også en mulighed.. Så er der SLET ikke noget du selv skal rette.. :)

Håber du kan bruge det tik noget

/Nicklas B.

prøv at se den nu.. http://www.bornstein.dk/diagram.php
Nu har jeg lavet det jeg talte om at DU kunne lave.. hehe.. ;)
Nu vælger man bare hvad max-størrelsen på pindene må være.. Og den regner så de andre ud fra den længeste.. Lige nu har jeg sat max-længden på 567..
Og den længeste vil så blive 567..

(tallene i paranteserne viser bare hvor lang den er, hvis du skulle være i tvivl.. ;)

og her kan du så se den, som du talte om, hvis tallet var meget højt.. Det eneste jeg har ændret er $maxlenght; http://www.bornstein.dk/diagram02.php

du kan også prøve at se denne.. http://www.bornstein.dk/diagram03.php?maxlenght=500
der kan du så bare skifte 500 ud, og se hvordan det virker..

tak for hjælpen. Det er godt nok en rigtig smart løsning :)

hov.. kunne da være du også lige skulle have koden ;)
den bliver nemlig ikke ved at ligge der hvor den gør nu :)

---------------kode---------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
    <title>Diagram</title>
<meta name="Generator" content="Stone's WebWriter 3">
</head>
<style>
body {
    background: #ffffff;
    margin-top: 5px;
    margin-right: 5px;
    margin-left: 5px;
    margin-bottom: 5px;
    text-align: left;
    font-family : tahoma;
    font-size: 11px;
}
</style>
<body>
<?
$var1 = 20;
$var2 = 40;
$var3 = 35;

$maxvar = max(intval($var1),intval($var2),intval($var3));
$varlenght = $maxvar/$maxlenght;

$var1dia = round($var1/$varlenght);
$var2dia = round($var2/$varlenght);
$var3dia = round($var3/$varlenght);

echo "Max-længde: <b>$maxlenght</b> px<p></p>";

echo "
<div style=\"background-color: #000000; color: #ffffff; width: $var1dia px; border: solid 1px #ffffff;\">$var1 ($var1dia)</div>
<div style=\"background-color: #000000; color: #ffffff; width: $var2dia px; border: solid 1px #ffffff;\">$var2 ($var2dia)</div>
<div style=\"background-color: #000000; color: #ffffff; width: $var3dia px; border: solid 1px #ffffff;\">$var3 ($var3dia)</div>
<p></p>
";

echo "
<div style=\"float: left; background-color: #000000; color: #ffffff; height: $var1dia px; border: solid 1px #ffffff;\">$var1</div>
<div style=\"float: left; background-color: #000000; color: #ffffff; height: $var2dia px; border: solid 1px #ffffff;\">$var2</div>
<div style=\"float: left; background-color: #000000; color: #ffffff; height: $var3dia px; border: solid 1px #ffffff;\">$var3</div>
";
?>

</body>
</html>
--------------/kode---------------

og hvis du så vil være HELT sikker på at den aldig bliver for lang, fx ved at man skriver 500.6 som længde kan du skrive en:

$maxlenght = floor($maxlenght);

i starten af scriptet.. for da man ikke kan lave halve pixel, vil det smarteste jo så være at runde ned.. men det er også at gå op i meget små bagateller ;)

dog kan man skrive 500.99999999999999 (14 9-taller)
Der vil den runde op til 500.. men det er så ligegyldigt.. hehe..

501 even.. undskyld hvis der kommer en masse mail nu.. hehe..