function DrawPieChart($cx, $cy, $r, $angle1 = 0, $angle2 = 0, $fill = 'red', $fill_opacity = 1, $stroke = 'black', $strokewidth = 0)
{
    list($x1, $y1) = polarToCartesian($cx, $cy, $r, $angle1);
    list($x2, $y2) = polarToCartesian($cx, $cy, $r, $angle2);
    if ($angle2 - $angle1 >= 360) {
        $long_arc_flag = 1;
    } else {
        $long_arc_flag = $angle2 - $angle1 > 180 ? 1 : 0;
    }
    $svg = '<path d="M' . $cx . ',' . $cy . ' L' . $x1 . ',' . $y1 . ' A' . $r . ',' . $r . ' 0 ' . $long_arc_flag . ',0 ' . $x2 . ',' . $y2 . ' z" fill="' . $fill . '" fill-opacity="' . $fill_opacity . '" stroke-width="' . $strokewidth . '"/>';
    return $svg;
}
    function DrawAngle($angle_deg, $showdegrees = FALSE)
    {
        // $angle_deg = 200;
        $width = 400;
        $height = 260;
        $stroke_width = 1;
        $color1 = '#F2F2F2';
        $color2 = 'black';
        $centerx = $width / 2;
        $centery = $height / 2;
        $radius1 = 100;
        $radius2 = 40;
        $svg = '<div class="img-question text-center">
					<svg width="' . $width . '" height="' . $height . '">
						<circle cx="' . $centerx . '" cy="' . $centery . '" r="' . $radius1 . '" fill="' . $color1 . '" />
						<line x1="' . $centerx . '" y1="' . $centery . '" x2="' . strval($centerx + $radius1) . '" y2="' . $centery . '" stroke="' . $color2 . '" stroke-width="' . $stroke_width . '" />';
        if ($angle_deg == 360) {
            $svg .= '<circle cx="' . $centerx . '" cy="' . $centery . '" r="' . $radius2 . '" stroke="black" fill="none" />';
        } elseif ($angle_deg <= 360) {
            list($x1, $y1) = polarToCartesian($centerx, $centery, $radius1, $angle_deg);
            list($x2, $y2) = polarToCartesian($centerx, $centery, $radius2, $angle_deg);
            $large_arc_flag = $angle_deg <= 180 ? 0 : 1;
            $svg .= '<path stroke="black" fill="none" d="M' . strval($centerx + $radius2) . ',' . $centery . ' A' . $radius2 . ',' . $radius2 . ' 0 ' . $large_arc_flag . ',0 ' . $x2 . ',' . $y2 . '" />
					<line x1="' . $centerx . '" y1="' . $centery . '" x2="' . $x1 . '" y2="' . $y1 . '" stroke="' . $color2 . '" stroke-width="' . $stroke_width . '" />';
        } else {
            $angle = 0;
            $radius = 30;
            while ($angle < $angle_deg) {
                list($x1, $y1) = polarToCartesian($centerx, $centery, $radius, $angle);
                list($x2, $y2) = polarToCartesian($centerx, $centery, $radius + 0.1, min($angle_deg, $angle + 5));
                $svg .= '<path stroke="black" fill="none" d="M' . $x1 . ',' . $y1 . ' A' . $radius . ',' . strval($radius + 0.5) . ' 0 0,0 ' . $x2 . ',' . $y2 . '" />';
                $angle += 5;
                $radius += 0.1;
            }
            list($x1, $y1) = polarToCartesian($centerx, $centery, $radius1, $angle_deg);
            $svg .= '<line x1="' . $centerx . '" y1="' . $centery . '" x2="' . $x1 . '" y2="' . $y1 . '" stroke="' . $color2 . '" stroke-width="' . $stroke_width . '" />';
        }
        if ($showdegrees) {
            $svg .= '<text font-size="15" fill="black" x="' . strval($centerx + $radius1 + 18) . '" y="' . strval($centery + 7) . '">$0°$</text>';
            $svg .= '<text font-size="15" fill="black" x="' . strval($centerx + 5) . '" y="' . strval($centery - $radius1 - 7) . '">$90°$</text>';
            $svg .= '<text font-size="15" fill="black" x="' . strval($centerx - $radius1 - 25) . '" y="' . strval($centery + 7) . '">$180°$</text>';
            $svg .= '<text font-size="15" fill="black" x="' . strval($centerx + 5) . '" y="' . strval($centery + $radius1 + 22) . '">$270°$</text>';
        }
        $svg .= '</svg></div>';
        return $svg;
    }
    function PieChart($angle_deg = NULL)
    {
        $width = 400;
        $height = 260;
        $cx = $width / 2;
        $cy = $height / 2;
        $r = 100;
        $svg = '<div class="img-question text-center">
					<svg width="' . $width . '" height="' . $height . '">';
        // Show angle
        if ($angle_deg) {
            if ($angle_deg == 360) {
                $svg .= DrawCircle($cx, $cy, $r, $stroke = 'black', $strokewidth = 0, $fill = '#CCC');
            } else {
                $svg .= DrawPieChart($cx, $cy, $r, 0, $angle_deg, $fill = '#CCC');
            }
            list($x1, $y1) = polarToCartesian($cx, $cy, $r, 0);
            list($x2, $y2) = polarToCartesian($cx, $cy, $r, $angle_deg);
            $svg .= DrawLine($cx, $cy, $x1, $y1);
            $svg .= DrawLine($cx, $cy, $x2, $y2);
        }
        // Circle
        $svg .= DrawCircle($cx, $cy, $r);
        // Ticks for every 10°
        for ($i = 0; $i < 36; $i++) {
            $angle = $i * 10;
            list($x1, $y1) = polarToCartesian($cx, $cy, $r + 5, $angle);
            list($x2, $y2) = polarToCartesian($cx, $cy, $r - 5, $angle);
            $svg .= DrawLine($x1, $y1, $x2, $y2);
        }
        // Show hint degrees
        $svg .= DrawText($cx + $r + 10, $cy + 7, '0°', 15);
        $svg .= DrawText($cx + $r + 5, $cy - 13, '10°', 15);
        $svg .= DrawText($cx - 8, $cy - $r - 7, '90°', 15);
        $svg .= DrawText($cx - $r - 40, $cy + 7, '180°', 15);
        $svg .= DrawText($cx - 15, $cy + $r + 22, '270°', 15);
        $svg .= '</svg></div>';
        return $svg;
    }
Exemple #4
0
 function DrawEdges($centerX, $centerY, $radius, $angle0, $degrees, $i, $color)
 {
     $points = count($degrees);
     $svg = '';
     $prev_degrees = 0;
     $zeros = 0;
     list($x1, $y1) = polarToCartesian($centerX, $centerY, $radius, $angle0);
     // calculate nodes with zero edges
     for ($j = 0; $j < $i; $j++) {
         $zeros += $degrees[$j] == 0 ? 1 : 0;
     }
     // calculate previous degrees
     for ($j = 0; $j < $i; $j++) {
         $prev_degrees += $degrees[$j] == count($degrees) - $zeros - 1 ? 1 : 0;
     }
     if ($i < count($degrees) - 1) {
         for ($j = 1; $j <= $degrees[$i] - $prev_degrees; $j++) {
             $angle = $angle0 + $j * 360 / $points;
             list($x2, $y2) = polarToCartesian($centerX, $centerY, $radius, $angle);
             $svg .= $this->DrawEdge($x1, $y1, $x2, $y2, $color);
         }
     }
     return $svg;
 }
Exemple #5
0
    function Graph($graph, $step = NULL)
    {
        $width = 400;
        $height = 300;
        $centerX = $width / 2;
        $centerY = $height / 2;
        $radius = 100;
        $svg = '<div class="img-question text-center">
					<svg width="' . $width . '" height="' . $height . '">';
        // $svg .= '<rect width="'.$width.'" height="'.$height.'" fill="black" fill-opacity="0.2" />';
        $size = count($graph);
        $angle0 = $size == 4 ? 45 : 90;
        // Edges
        for ($node1 = 0; $node1 < $size; $node1++) {
            if ($node1 < $step) {
                $color = $node1 == $step - 1 ? '#B155CF' : 'black';
                foreach ($graph[$node1] as $node2) {
                    if (!is_array($node2)) {
                        $angle1 = $angle0 + $node1 * 360 / $size;
                        $angle2 = $angle0 + $node2 * 360 / $size;
                        list($x1, $y1) = polarToCartesian($centerX, $centerY, $radius, $angle1);
                        list($x2, $y2) = polarToCartesian($centerX, $centerY, $radius, $angle2);
                        $svg .= DrawLine($x1, $y1, $x2, $y2, $color, 2);
                    }
                }
            }
        }
        // Nodes
        for ($node = 0; $node < $size; $node++) {
            $angle = $angle0 + $node * 360 / $size;
            if ($node < $step - 1) {
                $color = '#A1D490';
            } elseif ($node == $step - 1) {
                $color = '#B155CF';
            } else {
                $color = 'white';
            }
            list($x, $y) = polarToCartesian($centerX, $centerY, $radius, $angle);
            $svg .= DrawCircle($x, $y, 10, 'black', $width = 2, $color);
        }
        $svg .= '</svg></div>';
        return $svg;
    }