Cum să creezi un chart doar cu PHP

În tutorialul anterior am discutat despre cum putem crea un chart dinamic utilizând ChartJS pentru a crea toată interfața pe un element canvas, PHP-ul fiind necesar doar pentru a prelua informațiile dintr-o bază de date și pentru a le parsa în format Json scriptului.Acum vom merge pe o altă abordare și vom utiliza doar PHP pentru crearea întregului chart.Pentru aceasta ne vom folosi de funcțiile image din PHP pentru a crea o imagine cu chart-ul nostru. 1.Primul lucru pe care îl facem este să creăm un vector asociativ care să conțină informațiile ce vor fi prezente pe cele două axe.Pe axa Ox vom scrie lunile anului, iar pe axa Oy valorile numerice ce corespund fiecăreia. 1234567891011121314151617<?php # ——- Valorile chart-ului sub forma unui vector asociativ $values=array(     "Jan" => 110,     "Feb" => 130,     "Mar" => 215,     "Apr" => 81,     "May" =>...
Continue reading...

Cum să creezi un chart dinamic cu PHP, MySQL şi ChartJS

Chart-urile sunt o metodă grozavă de aranjare a datelor, oferind un suport vizual pe lângă informaţiile “brute”.Sunt o mulţime de script-uri în Javascript(+Jquery) care ne oferă această posibiliate, de a crea chart-uri, chiar şi interactive, dar nu dinamice.Adesea, informaţiile din chart-uri s-ar putea afla într-o bază de date, separate de locaţia unde se utilizează. De aceea, m-am gândit să vă arăt cât de simplu este să faci un chart interactiv, cu PHP, MySQL şi ChartJS. Presupun că acei dintre voi care citesc tutorialul au habar de PHP şi MYSQL şi nu mai e necesar să intrăm în detaliile de bază. 1.Inserarea unui chart static Prima preocupare este să creăm un chart static, iar pentru a face asta vom folosi un plugin  foarte fain, ChartJS, creat în javascript şi care atribuie unui element canvas toate configurările şi scripturile necesare creării unui chart.Va trebui după ce descărcaţi să copiaţi în folderul dorit...
Continue reading...

CSS Orientat pe Obiect

Încă de prin 2009, un webmaster renumit, pe nume Nicole Sullivan a pus bazele celei mai interesante metode de a scrie CSS.Era numită CSS Orientat pe Obiect.CSSOO e unul din acele lucruri care mi-a lăsat o impresie foarte bună, încă de când l-am auzit ca și concept și e cu siguranță una din chestiile pe care i l-aș spune oricărui web developer.Pentru mine, chestiile cu adevărat importante sunt: să nu folosesc nicioadată id-uri pentru a face referință la un element, astea le las pentru Javascript; nu specific elementele; și folosesc clase multiple pentru a stila elementele. Prima se înțelege de la sine.Dacă stilezi un id ajungi într-o fundătură, nu vei mai putea să îl reutilizezi.Făcând referință la elemente cu ajutorul claselor, ai întotdeauna posibilitatea să reutilizezi stiluri; și singura problemă la ele e ordinea  în care elementele se succed. A doua se leagă de prima, atunci când faci referință la...
Continue reading...

Creează un meniu responsive în CSS

Acum, orice design serios trebuie să fie responsive, să își păstreze funcționalitatea pe orice device indiferent de rezoluția sa.Am aflat acum de o nouă tehnică prin care putem crea un meniu responsive fără a mai folosi Javascript.Folosește un cod HTML5 simplu, iar meniul poate fi aliniat la stânga, centru sau pe dreapta.Acest meniu se va afișa la hover, fără a mai fi necesar pentru user să dea clic pe el, ceea ce e mult mai facil. Demo Responsive web design Vom porni desigur de la o listă pe care o vom stila.Această tehnică își arată adevăratul potențial atunci când meniul este compus din multe elemente care, la o rezoluție mică ar arată foarte dezordonat.Astfel, toate acele elemente se condensează într-un singur buton care e un elegant dropdown. Codul HTML pentru nav Mai jos e codul HTML necesar meniului.Tagul nav este necesar pentru a crea dropdown-ul cu proprietatea CSS absolute.Clasa .current...
Continue reading...

Totul despre trazițiile din CSS3

Toată lumea iubește mișcarea.Adăugând a patra dimensiune, timpul(de fapt în acest caz timpul e treia dimensiune, căci un website este în 99.99% din cazuri bidimensional – asta la momentul scrierii acestui articol), la un website este principalul mod prin care designul de pe ecran se evidențiază de cel fizic scris, printat.Trazițiile CSS sunt o metodă simplă prin care poți anima elementele unei pagini fără a mai utiliza Javascript sau Flash. W3C ne spune că tranzițiile permit de fapt schimbarea proprietăților din CSS într-un mod mai fluid, pe o perioadă de timp determinată.În alte cuvinte, tranzițiile CSS ne permit să modificăm o proprietate gradual, creând iluzia de mișcare astfel adăugând design-ului acea emoție și subtilitate pe care nu o simțim într-un timp foarte scurt. Suportul browserelor Toate browserele moderne, chiar și IE suportă tranzițiile CSS.Totuși, e important să știm că browserele care nu suportă această proprietate vor ignora pur și simplu...
Continue reading...

Instalarea și configurarea unui server WAMPP

Actualizat 22/09/2016 Mai jos vă prezint un videoclip istoric(cred că are vreo 5-6 ani)…atunci aveam corzile vocale nedezvoltate (-: Sunt momente când devenim atât de impacientați atunci când vrem să facem ceva cu totul nou încât uităm de chestiile de bază. Pentru web developeri e foarte important, de fapt esențial, să-și poată testa aplicațiile local înainte de a merge live. Mare parte a web-ului se bazează pe Linux, pe MySQL, PHP, sau LAMP pentru a rula site-urile dinamice, dar asta nu înseamnă că toți web developerii codează într-un sistem Linux. Cei care preferă Windows pot replica modul în care codul funcționează cu WAMP, un  soft capabil să creeze un server local. Pentru a obține o copie WAMPP Înainte de a face ceva trebuie să descarci o copie, care e și gratuită de pe http://www.wampserver.com/en/download.php.Vei avea opțiunea între a alege versiunea de 32, respectiv 64-bit.În afară de Apache, PHP și MySQL aplicația...
Continue reading...