Répartition des données dans le cercle

Question

Disons que j'ai des éléments (E1, E2, ... ,En) qui ont des valeurs individuelles qui varient en [1; 100]. J'ai un cercle (voir la figure ci-dessous) et chaque deux cercle représentent la gamme de données.
Le problème est comment montrer la distribution de ces éléments de E dans ce cercle. La figure ci-dessous illustre la distribution de certains éléments du E dans le cercle, par exemple E1=10, E2=35,...,E6=100, E7=91. Y a-t-il des bibliothèques prêtes en PHP ou des plugins dans jQuery ou une solution prête?
Je dois mettre en œuvre ce problème dans mon application Web en utilisant HTML + CSS + jQuery (ne pas offrir de solution avec les technologies flash, s'il vous plaît).
Note: C'est comme créer des graphiques dans MS Excel. Par exemple dans MS Excel il ya un type de graphique appelé Radar qui implémente plus ou moins ce problème, mais dans mon cas, j'ai des cercles au lieu de polygone et j'ai seulement une portée limitée de [1;100].

Modifier
J'ai oublié de mentionner que dans cette figure d'objet élémentqui est au centre est l'objet basé sur lequel nous montrons la distribution. Si l'élément correspond à l'objet avec plus de pourcentage, fermez-le à l'objet et vice versa. Distribution of data in the circle http://i47.tinypic.com/dqisyo.jpg

Answer 1

Ceci est incomplet, consultez le manuel GD sur la façon d'ajouter du texte, etc.

<?php 
$size = 501; //odd 

$img = imagecreatetruecolor($size, $size); 

$center = array((int) ($size/2), (int) ($size/2)); 
$colors['white'] = imagecolorallocate($img, 255, 255, 255); 
$colors['black'] = imagecolorallocate($img, 0, 0, 0); 
$colors['blue'] = imagecolorallocate($img, 0, 0, 255); 

imagefill($img, 0, 0, $colors['white']); 

$valid_rad = array((int) (($center[0] - 1) * .2), (int) (($center[0] - 1) * .9)); 

function radius_for($percentage, $valid_rad) { 
    return $valid_rad[1] - ($valid_rad[1] - $valid_rad[0]) * 
     ($percentage/100); 
} 

foreach (array(0,25,50,75,100) as $perc) { 
    $radius = radius_for($perc, $valid_rad); 
    imagearc($img, $center[0], $center[1], $radius*2, $radius*2, 
     0, 360, $colors['black']); 
} 


foreach (array(100,85,70,36,23,2) as $perc) { 
    $radius = radius_for($perc, $valid_rad); 
    $angle = pi() * 1.25 + ((rand(0,100) - 50)/50) * .5; 
    $x = (int) ($radius * cos($angle)) + $center[0]; 
    $y = (int) ($radius * sin($angle)) + $center[1]; 

    imagefilledellipse($img, $x, $y , 20, 20, $colors['blue']); 
} 


header("Content-type: image/png"); 
imagepng($img); 

Cela donne une image comme ceci:

Answer 2

Je ne connais pas de graphiques pré-faits comme ça. Cependant, vous pouvez peut-être le répliquer avec un nuage de points avec un arrière-plan personnalisé. Here sont quelques jquery. Vous auriez à faire le calcul pour créer les coordonnées x, y avec la distance appropriée du point central, mais le plug-in de diagramme devrait prendre soin du reste.