Kuchendiagramm

[enky]

Hallo zusammen,

folgendes Problem! Ich soll demnächst ein Kuchendiagramm erstellen. Ich hab mich jetzt schon die Forensuche und durch google gesucht, zwar auch Sachen gefunden, aber die erschlagen mich irgendwie allesamt.

Was ich müsste ist, wie zeichne ich nur einen bestimmten Teil eines Kreis, zb nur 45°.

Was ich so gelesen habe, rechnen wir hier mit cos, sin.

Was dahin gehen dann noch Klasse zu wissen wäre, wie kannn ich sagen, dass ich den Kreis zeichnen will, aber nicht bei 0° anfängt sondern bei 45°.

Ich danke euch vielmals für eure Hilfe, vll bin ich auch einfach überarbeitet...

[milchreis]

As3 Pie Chart | Flex Streamer

[andrelehnert]

Hi, müsste selbsterklärend sein:

PHP-Code:

const RADIANS_TO_DEGREES:Number = Math.PI / 180;
const PRECISION :Number = .1;
var spr:Sprite = new Sprite();
addChild(spr);

function drawEllipseSegment(col:uint, startAngle:Number, angle:Number, xRad:Number, yRad:Number)
{
    var g = spr.graphics;
    var currAngle:Number = startAngle;
    g.moveTo(0, 0);
    g.beginFill(col, 100);
    g.lineStyle(1, col, 100);
    while (currAngle <= angle + startAngle)
    {
        var x:Number = Math.sin(currAngle * RADIANS_TO_DEGREES) * xRad;
        var y:Number = Math.cos(currAngle * RADIANS_TO_DEGREES) * yRad;
        g.lineTo(x, y);
        currAngle += PRECISION;
    }
    g.endFill();
}

drawEllipseSegment(0xcc0000, 45, 60, 100, 100); 


LG ANdré

[Martin Kraft]

@andrelehnert+milchreis: Das mit lineTo zu lösen, find ich hier ziemlich unschön, weil man so unnötigerweise Unmengen an Punkten produziert. Kurven sollte man schon mit curveTo zeichnen.

Hier mal die passende Klasse aus meinem utils-Paket:

PHP-Code:

package com.martinkraft.utils {
    
    import flash.display.Graphics;
    import flash.geom.Point;
    import flash.geom.Rectangle;
    import com.martinkraft.geom.Util2D;
    
    public class GraphicsUtil{
        
        ////
        
        static public function drawRingClockwise( graphics:Graphics, offset:Point, outerRadius:Number, innerRadius:Number = 0, segmentRad:Number = 360,  startRad:Number = 0):void {
            return drawRing( graphics, offset, outerRadius, innerRadius, MathUtil.toRad(-segmentRad), MathUtil.toRad(180-startRad));
        }
        
        static public function drawRingDeg( graphics:Graphics, offset:Point, outerRadius:Number, innerRadius:Number = 0, segmentRad:Number = 360,  startRad:Number = 0):void {
            return drawRing( graphics, offset, outerRadius, innerRadius, MathUtil.toRad(segmentRad), MathUtil.toRad(startRad));
        }
        
        static public function drawRing( graphics:Graphics, offset:Point, outerRadius:Number, innerRadius:Number = 0, segmentRad:Number = Math.PI * 2,  startRad:Number = 0):void {
            
            if (!offset) offset = new Point();
            
            var steps        :uint = Math.ceil( Math.abs(4 * segmentRad / Math.PI) );
            var partRad        :Number = segmentRad / steps;
            var halfPartRad    :Number = partRad / 2;
            var endRad        :Number = startRad + segmentRad;
            
            var curveFactor    :Number = 1 / Math.cos( halfPartRad );
            var curveRadius    :Number = curveFactor * outerRadius;
            
            var i            :uint;
            
            // OuterCircle ////////////////////////
            
            var rad            :Number = startRad;
            var startPoint    :Point = Util2D.fromRad(rad, outerRadius).add(offset);
            moveToPoint(graphics, startPoint);
            
            while(++i <= steps) {
                rad += partRad;
                curveToPoints(graphics, Util2D.fromRad(rad - halfPartRad, curveRadius).add(offset), Util2D.fromRad(rad, outerRadius).add(offset));
            } 
            
            if (innerRadius === 0) { 
                // Center /////////////////////////
                
                lineToPoint(graphics, offset);
                
            } else {
                // InnerCircle ////////////////////
                
                curveRadius = curveFactor * innerRadius;
                lineToPoint( graphics, Util2D.fromRad(rad, innerRadius).add(offset));
                
                while(--i > 0) {
                    rad -= partRad;
                    curveToPoints(graphics, Util2D.fromRad(rad + halfPartRad, curveRadius).add(offset), Util2D.fromRad(rad, innerRadius).add(offset));
                } 
            }
            
            lineToPoint(graphics, startPoint);
        }
        
        static public function drawRectangle( graphics:Graphics, rect:Rectangle ):void {
            graphics.drawRect( rect.left, rect.top, rect.width, rect.height );
        }
        
        static public function drawRoundedRectangle( graphics:Graphics, rect:Rectangle, ...radii:Array ):void {
            if (radii.length <= 0) {
                drawRectangle(graphics, rect);
                return;
            }
            
            while (radii.length < 4) radii.push(0);
            
            var previous:Vector.<Point> = new <Point>[
                new Point(0, 1),
                new Point(-1, 0),
                new Point(0, -1),
                new Point(1, 0)
            ];
            var following:Vector.<Point> = new <Point>[
                new Point(1, 0),
                new Point(0, 1),
                new Point(-1, 0),
                new Point(0, -1)
            ];
            var points:Vector.<Point> = new <Point>[
                new Point(rect.left, rect.top),
                new Point(rect.right, rect.top),
                new Point(rect.right, rect.bottom),
                new Point(rect.left, rect.bottom),
            ];
            
            var min:Number = Math.min(rect.width, rect.height)/2;
            var r:Number;
            var p:Point;
            var drawTo:Function = function(x:Number, y:Number):void {
                graphics.moveTo(x, y);
                drawTo = graphics.lineTo;
            }
            
            for (var i:uint = 0; i < radii.length; i++ ) {
                r = Math.min(radii[i], min);
                p = points[i];                
                if (r) {
                    drawTo(
                        p.x + r * previous[i].x,
                        p.y + r * previous[i].y
                    );
                    graphics.curveTo(
                        p.x,
                        p.y,
                        p.x + r * following[i].x,
                        p.y + r * following[i].y
                    );
                } else {
                    drawTo(p.x, p.y);
                }
            }
            
        }
        
        static public function drawRoundedRect( graphics:Graphics, x:Number, y:Number, width:Number, height:Number, ...radii:Array ):Rectangle {
            var rect:Rectangle = new Rectangle(x, y, width, height);
            drawRoundedRectangle.apply(null, [graphics, rect].concat(radii) );
            return rect;
        }
        
        static public function drawLine( graphics:Graphics, ...xYs:Array):void {
            var l:uint = xYs.length;
            if (l < 2) return;
            var i:uint = 0;
            graphics.moveTo(xYs[i++], xYs[i++]);
            while (i < l) graphics.lineTo(xYs[i++], xYs[i++]);
        }
        
        static public function drawLinePoints( graphics:Graphics, ...points:Array ):void {
            var l:uint = points.length;
            if (l < 1) return;
            
            var point:Point = Point(points[0]);
            graphics.moveTo(point.x, point.y);
            
            for (var i:uint = 1; i < l; i++) {
                point = Point(points[i]);
                graphics.lineTo(point.x, point.y);
            }
        }
        
        static public function drawCurve( graphics:Graphics, ...xYs:Array):void {
            var l:uint = xYs.length;
            if (l < 2) return;
            var i:uint = 0;
            graphics.moveTo(xYs[i++], xYs[i++]);
            while (i < l) graphics.curveTo(xYs[i++], xYs[i++], xYs[i++], xYs[i++]);
        }
        
        static public function drawCurvePoints( graphics:Graphics, ...points:Array ):void {
            var l:uint = points.length;
            if (l < 1) return;
            
            var curvePoint:Point;
            var point:Point = Point(points[0]);
            graphics.moveTo(point.x, point.y);
            
            for (var i:uint = 1; i < l; i += 2) {
                curvePoint = Point(points[i]);
                point = Point(points[i+1]);
                graphics.curveTo(curvePoint.x, curvePoint.y, point.x, point.y);
            }
        }
        
        static public function moveToPoint( graphics:Graphics, p:Point ):void {
            graphics.moveTo(p.x, p.y);
        }
        
        static public function lineToPoint( graphics:Graphics, p:Point ):void {
            graphics.lineTo(p.x, p.y);
        }
        
        static public function curveToPoints( graphics:Graphics, controlPoint:Point, anchorPoint:Point ):void {
            graphics.curveTo( controlPoint.x, controlPoint.y, anchorPoint.x, anchorPoint.y );
        }

        ////
        
    }

} 


[milchreis]

da hast du recht.

An deinem Beitrag stört mich das "meine".
Gibt's denn kein vernünftiges Grafik framework?
Ich kenne bloß degrafa, was aber wohl eingeschlafen ist.
Als ich das letzte mal geschaut habe, gab's das auch nicht für pures As3.

Vor 3D Engines kann man sich ja nicht mehr retten, aber wenn's um Pacman geht, kocht wieder jeder selbst.

[Martin Kraft]

[QUOTE=milchreis;2005855]da hast du recht.

Zitat von milchreis

An deinem Beitrag stört mich das "meine".
Gibt's denn kein vernünftiges Grafik framework?

Keine Ahnung.

Aber ist es nicht normal, dass jeder Entwickler mit der Zeit häufig verwendete Funktionen und Klassen sammelt und sich so eine Art Werkzeugkasten aufbaut? Das betrifft ja nicht nur die Grafik, sondern auch alle möglichen Aufgaben, wie irgendwelche mathematischen Algorithmen, etc.

Man kann ja nicht immer darauf warten, das irgendwer irgendwann mal dafür ein Framework schreibt?!

[andrelehnert]

@Martin:
Ja - hast Du recht.

Ich habe mit curveTo noch nicht allzuviel gearbeitet - deshalb ists nicht
immer gleich präsent.

Frameworks muss man erstens immer erstmal suchen/finden und sich
einarbeiten.
Ich hab für einfachere Problemstellungen(Algorithmen, Positionierung, scaling, Interactivität) auch ne Menge selbstgeschriebenes Zeug in meinem utils-Ordner.
Der Vorteil ist die mir warm-vertraute Struktur und problembezogene schnelle Anpassbarkeit. So produziere ich weniger Overhead und recherchiere nicht standig noch diese und jene Bibliotheken.

Bei komplexeren Problemstellungen sieht das natürlcih anders aus. Ne eigene 3D-Engine hab ich mir nicht geschrieben - mal davon abgesehen, das ICH das auch nicht könnte.

LG ANdré

[enky]

Vielen DANK für eure Postings! Hat schon sehr geholfen.

Nun hab ich etwas rumgebastelt und es geht auch soweit nur ein Fehler tritt auf. Am besten mal die FLA anschauen, ist als cs4 und cs5 drin.

Das Problem ist, dass wenn ich Set2 aktiviere. nicht alle Flächen eingefärbt werden, aber sie durchaus in der Berechnung einen Platz finden, also Tortendiagramm wird richtig dargestellt aber sie sind nicht sichtbar.

Irgendwie finde ich den Fehler nicht.