Pereiti prie turinio

Piešti ant nuotraukos


Rekomenduojami pranešimai

Sveiki,

 

Man reikia ant nuotraukos nupiešti stulpelį, o tada pildyti pagal reikšmes. Tarkim jeigu maksimali reikšmė 1000, o reikšmė statoma yra 500 tai pusė užsipildo, jeigu 250 ketvirtadalis, aišku maksimali reikšmė keisis, bet dydis, kad pačios lentelės nesikeistų dėl to.

 

Lyg pradžia tokia turėtų būt:

 

header("Content-Type: image/png");

$im = imagecreatefrompng("backgrounds/photo.png");

 

Bet ir tuo pačiu, kad ta lentelė jinai nebūtų vienos spalvos nu, kad eitų kelti photoshopintas spalvas, kaip būna tie visokie krovimai liko kiek liko krautis, tai būna gražios lentelės.

Nuoroda į pranešimą
Dalintis kituose puslapiuose

Tai čia kaip supratau tau vieno stulpelio diagramos reik? Siūlau naudoti HTML5 svg. Nesunkiai šitą turėtum padaryt, jei susipažinsi su tuo iš arčiau. Dar su JavaScript ir CSS pažaisi truputi(if data-current(atributas) == 50, tada su kordinatėm žaidi) ir viskas.

 

--Edit--------

 

Pagalvojau, kad čia išvis su CSS ir JS galima lengvai tai padaryti. Tiesiog su div'u ir jo stiliais žaist reik.

 

Pirmas metodas tau leis padaryt, kad iš tiesų ant nuotraukos pieštum, o antras tau leis tai imituoti.

Redagavo Steeler
Nuoroda į pranešimą
Dalintis kituose puslapiuose

Nu tai duok kokį pavizdinį kodą, kad eitų praktikuotis.

Taip, turėtum truputi pagarbiau elgtis. Sugaišau virš pusvalandžio dėl tavęs(pačiam reikėjo dokumentacijas skaityti ir nagrinėti, ką kas daro), bet gal lengviau bus suprasti tau. Ateityje, kai pasako su kuo gali pasidaryti, pats paieškok kodo fragmentų.

 

Nežinau ar tiksliai supratau, bet gavosi kažkas tokio. Kaip ir už tave padariau, tik diagrama nėra paveikslėlio dalis(jei siųsies img, jos nebus jame).

 

Aišku čia nėra JS dalies, kuria neabejoju, kad susitvarkysi pats, nes jei dar ir tą, tai samdytis mane turėsi :D

 

post-64104-0-98151500-1419640442_thumb.png

 

<!DOCTYPE html>
<html>
   <head>
       <title>Demo with SVG</title>
       <style type="text/css">
           .container{
               margin:50px auto;
               width:480px;
           }
       </style>
   </head>
   <body>
       <div class="container">
           <svg width="480px" height="226px" version="1.1"
                xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
               <g>
                   <image x="0" y="0" width="100%" height="100%"
                          xlink:href="http://www.cafex.com/wp-content/uploads/2012/09/demo_banner.png">
                   </image>
                   <rect x="0" y="200" width="100%" height="10" style="fill:blue;"></rect>
                   <rect x="0" y="200" width="40%" height="10" style="fill:red;"></rect>
               </g>
           </svg>
       </div>
   </body>
</html>

Redagavo Steeler
Nuoroda į pranešimą
Dalintis kituose puslapiuose

Nu tai jis darė su funkcijom html kalba, o and <?php kitaip turėtų atrodyt.

Php yra server side kalba, kuri nėra atsakinga už interface'ą. Su ja turėtum pvz. iš duomenų bazės ištraukti duomenis(nežinau iš ko susideda ta tavo diagrama, turi būti kažkokia statistika), tuomet susiskaičiuoti procentais(php) ir paduoti kintamąjį, kiek procentų turėtų būti užpildyta šita diagrama(matai, kad čia yra 40%).

Redagavo Steeler
Nuoroda į pranešimą
Dalintis kituose puslapiuose

Nu tai aš php tam naudoju kaip minėjai jungtis prie duomenų bazės , tada yra dvi reikšmės žmogus jas pats įveda maksimali reikšmė ir dabartinė reikšmė, tarkim maksimali reikšmė gali būt, kad ir 5000, o dabartinė 22 ar 225. O tai kaip man tada įterpt tą tavo kodą į savo <?php ?

Nuoroda į pranešimą
Dalintis kituose puslapiuose

Mes tau nepadarysim uz tave, jei tau reikia, kad sugeneruotu nauja paveiksliuka (ne kaip Steeler siule), ieskok google, pilna pamoku manipuliacijos. Padaryk kiek iseina, jei kazkas uzstrigs, idek koda - bandysim pagelbet. Jei nemoki programuot, tada teks ieskot kazko kas uz $ padarytu.

Redagavo Imago
Nuoroda į pranešimą
Dalintis kituose puslapiuose

Bet čia neduoda ant nuotraukos kokios piešt kaip čia reikia:

 

$im = imagecreatefrompng("backgrounds/photo.png");

Lievas tas GD modulis... Esu naudojęs. Aišku gali, jei nori, bet yra gersnių būdų. Su tuo pačiu svg gali padaryti, kad sugeneruotu viską į vieną img. Sry, neberašysiu kodo nemokamai, turiu ir taip darbų.

Nuoroda į pranešimą
Dalintis kituose puslapiuose

Prisijunkite prie diskusijos

Jūs galite rašyti dabar, o registruotis vėliau. Jeigu turite paskyrą, prisijunkite dabar, kad rašytumėte iš savo paskyros.

Svečias
Parašykite atsakymą...

×   Įdėta kaip raiškusis tekstas.   Atkurti formatavimą

  Only 75 emoji are allowed.

×   Nuorodos turinys įdėtas automatiškai.   Rodyti kaip įprastą nuorodą

×   Jūsų anksčiau įrašytas turinys buvo atkurtas.   Išvalyti redaktorių

×   You cannot paste images directly. Upload or insert images from URL.

Įkraunama...
  • Dabar naršo   0 narių

    Nei vienas registruotas narys šiuo metu nežiūri šio puslapio.

×
×
  • Pasirinkite naujai kuriamo turinio tipą...