Cirkel html php 4 delen moeten er 6 worden

[Seantf]

Hallo ik heb hier een cirkel met 4 delen maar ik wil er graag 1 met 6 delen kan iemand mij hiermee helpen? En later moet ik er ook 1 met 30 delen


Html

<link rel="stylesheet" type="text/css" href="style.css">


<div id="center">
<div id="tl"></div>
<div id="tr"></div>
<div id="bl"></div>
<div id="br"></div>
</div>

CSS

div {
width: 50px;
height: 50px;
background-color: #ccc;
background-color: #ccc;
-moz-border-radius: 100px ;
border-radius:  100px;

}

#center {position: relative; margin: 100px 0 0 100px; border: solid #fff 1px; }

#tl, #tr, #bl, #br {
position: absolute;
height: 75px;
width: 75px;

}

#tl {
  border-radius: 100px 0 0 0;
  -moz-border-radius: 100px 0 0 0;
  top: -50px;
  left: -50px;
  z-index: -1;
}

#tr {
  border-radius: 0 100px 0 0;
  -moz-border-radius: 0 100px 0 0;
  top: -50px;
  left: 26px;
  z-index: -1;
}

#bl {
  border-radius:  0 0 0 100px;
  -moz-border-radius:  0 0 0 100px;
  top: 26px;
  left: -50px;
  z-index: -1;
}

#br {
  border-radius: 0  0 100px 0;
  -moz-border-radius: 0  0 100px 0;
  top: 26px;
  left: 26px;
  z-index: -1;
}

 

[Tha Devil]

Waarom maak je geen gebruik van een Javascript grafiek-bibliotheek zoals ChartJS: http://www.chartjs.org/docs/#doughnut-pie-chart-introduction?

 

[Domero]

HTML5 heeft een extentie die heet SVG. Hiermee kun je tekenen in een HTML site.
Volgens mij is dat exact wat je wilt http://www.w3schools.com/svg/default.asp

 

[Seantf]

Het probleem zit hem er in wat ik er later mee moet gaan doen voorbeeld:


En dat moet ik dan omzetten naar een pdfje zodra ik canvas of svg ga gebruiken en probeer hem om te zetten naar pdf dan glitcht het heleprogramma :S

Uit eindelijk moet de ring met al dit tabjes klikbaar worden en kleur veranderd worden

de textboxen moeten direct aanpasbaar zijn als je dubbel klikt en dan weer dubbel klikken om te locken :S

Dus eigelijk moet ik het gewoon met html en php doen zonder canvas of svg.
Is dit mogelijk ?

 

[Domero]

ik zou hem dan omleiden naar een script met ImageMagik, en daar een map overheen leggen.
Want om nu divjes te maken in puur HTML van 1x1 pixel.. die clickable zijn, is me A HELL LOT OF CODE.

Juist voor dit soort toepassingen zijn canvas en svg uitgevonden.

 

[Seantf]

Canvas en svg hebben de nadelen van dat textboxen en dergelijke toevoegen gaat lastig tot niet en positioneren is nog moeilijker en zodra je een pdfje er van wilt maken gaan de delen of weg of ze staan op een andere plek dna waar jij ze gepositioneerd heb :S ik kan het opzich wel met ene plaatje laten zien wat ik bedoel.

 

[Seantf]

Zoals je ziet het is helemaal naar de knoppe door canvas/svg :S

 

[Domero]

Ik zie,..volgens mij blijft dit http://php.net/manual/en/book.imagick.php toch de beste oplossing

 

[Seantf]

Ik snap er niets van van dat imagick :X Als er nog andere opties zijn hoor ik ze graag anders ga ik de pdf converter er gewoon vanaf halen dan moet er maar een screen shot gemaakt worden.

 

[Domero]

Sorry makkelijker kunnen we het niet maken, 1337er wel