Pie chart: Difference between revisions

From JSXGraph Wiki
No edit summary
No edit summary
Line 35: Line 35:
                                                 this.midpoint.coords.usrCoords[2]+dy*(z+ddy)/z],
                                                 this.midpoint.coords.usrCoords[2]+dy*(z+ddy)/z],
                                                 this.board);
                                                 this.board);
             this.board.renderer.updateArc(this);
             this.prepareUpdate().update().updateRenderer():
           
            this.board.renderer.updateLine(this.additionalLines[0]);
           
            dx = - this.midpoint.coords.usrCoords[1] + this.additionalLines[1].point2.coords.usrCoords[1];
            dy = - this.midpoint.coords.usrCoords[2] + this.additionalLines[1].point2.coords.usrCoords[2];
           
            ddx = 20/(this.board.stretchX);
            ddy = 20/(this.board.stretchY);
            z = Math.sqrt(dx*dx+dy*dy);           
            this.additionalLines[1].point2.coords = new JXG.Coords(JXG.COORDS_BY_USER,
                                                [this.midpoint.coords.usrCoords[1]+dx*(z+ddx)/z,
                                                this.midpoint.coords.usrCoords[2]+dy*(z+ddy)/z],
                                                this.board);
            this.board.renderer.highlight(this.additionalLines[1]);
            this.board.renderer.updateLine(this.additionalLines[1]);
         };
         };
            
            
Line 70: Line 55:
                                                 this.midpoint.coords.usrCoords[2]+dy*(z-ddy)/z],
                                                 this.midpoint.coords.usrCoords[2]+dy*(z-ddy)/z],
                                                 this.board);
                                                 this.board);
             this.board.renderer.updateArc(this);
             this.prepareUpdate().update().updateRenderer():
           
            this.board.renderer.updateLine(this.additionalLines[0]);                                             
 
 
            this.board.renderer.noHighlight(this);
           
            dx = -this.midpoint.coords.usrCoords[1] + this.additionalLines[1].point2.coords.usrCoords[1];
            dy = -this.midpoint.coords.usrCoords[2] + this.additionalLines[1].point2.coords.usrCoords[2];
           
            ddx = 20/(this.board.stretchX);
            ddy = 20/(this.board.stretchY);
            z = Math.sqrt(dx*dx+dy*dy);
           
            this.additionalLines[1].point2.coords = new JXG.Coords(JXG.COORDS_BY_USER,
                                                [this.midpoint.coords.usrCoords[1]+dx*(z-ddx)/z,
                                                this.midpoint.coords.usrCoords[2]+dy*(z-ddy)/z],
                                                this.board);                                             
            this.board.renderer.updateLine(this.additionalLines[1]);
         };  
         };  
     }
     }

Revision as of 13:41, 17 June 2010

A pie chart with highlight on the whole sector, enlarging labels on highlight and a gradient fill.

JavaScript code to produce this chart

Soon ...