`
jorneyR
  • 浏览: 16020 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
文章分类
社区版块
存档分类
最新评论

看到别人写的3D饼图,模仿了一个

阅读更多
鼠标点击饼图时,被点击的部分会移动出来。
代码重新重构过,看上去更舒服一点点.
修复几个Bug.




import java.awt.geom.Point2D;

public class GeometryUtil {
    // 两点之间的距离
    public static double distanceOfPoints(Point2D p1, Point2D p2) {
        double disX = p2.getX() - p1.getX();
        double disY = p2.getY() - p1.getY();
        double dis = Math.sqrt(disX * disX + disY * disY);

        return dis;
    }

    // 两点的中点
    public static Point2D middlePoint(Point2D p1, Point2D p2) {
        double x = (p1.getX() + p2.getX()) / 2;
        double y = (p1.getY() + p2.getY()) / 2;

        return new Point2D.Double(x, y);
    }

    // 在两点所在直线上,以从startPoint到endPoint为方向,离startPoint的距离disToStartPoint的点
    public static Point2D extentPoint(Point2D startPoint, Point2D endPoint, double disToStartPoint) {
        double disX = endPoint.getX() - startPoint.getX();
        double disY = endPoint.getY() - startPoint.getY();
        double dis = Math.sqrt(disX * disX + disY * disY);
        double sin = (endPoint.getY() - startPoint.getY()) / dis;
        double cos = (endPoint.getX() - startPoint.getX()) / dis;
        double deltaX = disToStartPoint * cos;
        double deltaY = disToStartPoint * sin;

        return new Point2D.Double(startPoint.getX() + deltaX, startPoint.getY() + deltaY);
    }
}

import java.awt.Color;
import java.awt.geom.Arc2D;
import java.awt.geom.Area;
import java.awt.geom.GeneralPath;
import java.awt.geom.Point2D;

class Pie {
    private Arc2D arc; // 这里的弧并不是圆上的一弧,而是椭圆的一部分.
    private Area frontSite;
    private Area leftSite;
    private Area rightSite;
    private Color color;
    private Pie selectedPie;

    private Point2D arcMiddle;
    private Point2D labelPosition;

    private double value;
    private int shadowDepth;
    private double selectedShiftDis; // 被选中的饼图在他的中线上移动的距离

    public Pie(Arc2D arc, Color color, double value) {
        this(arc, color, value, 10, 30);
    }

    public Pie(Arc2D arc, Color color, double value, int shadowDepth, double selectedShiftDis) {
        this.arc = arc;
        this.color = color;
        this.value = value;
        this.selectedShiftDis = selectedShiftDis;
        this.shadowDepth = shadowDepth;

        Arc2D arcBottom = new Arc2D.Double(arc.getX(), arc.getY() + shadowDepth, arc.getWidth(),
            arc.getHeight() + 0, arc.getAngleStart(), arc.getAngleExtent(), Arc2D.CHORD);
        Point2D[] topPs = getPointsOfArc(arc);
        Point2D[] bottomPs = getPointsOfArc(arcBottom);

        // Front site
        GeneralPath <script type="text/javascript" src="http://www.iteye.com/javascripts/tinymce/plugins/javaeye/langs/zh.js"></script><script type="text/javascript" src="http://www.iteye.com/javascripts/tinymce/themes/advanced/langs/zh.js"></script>font = new GeneralPath();
        font.moveTo(topPs[1].getX(), topPs[1].getY());
        font.lineTo(topPs[2].getX(), topPs[2].getY());
        font.lineTo(bottomPs[2].getX(), bottomPs[2].getY());
        font.lineTo(bottomPs[1].getX(), bottomPs[1].getY());
        font.closePath();
        this.frontSite = new Area(arcBottom);
        this.frontSite.add(new Area(font));

        // Left site
        GeneralPath left = new GeneralPath();
        left.moveTo(topPs[0].getX(), topPs[0].getY());
        left.lineTo(topPs[1].getX(), topPs[1].getY());
        left.lineTo(bottomPs[1].getX(), bottomPs[1].getY());
        left.lineTo(topPs[0].getX(), topPs[0].getY() + 3);
        left.closePath();
        this.leftSite = new Area(left);

        // Right site
        GeneralPath right = new GeneralPath();
        right.moveTo(topPs[0].getX(), topPs[0].getY());
        right.lineTo(topPs[2].getX(), topPs[2].getY());
        right.lineTo(bottomPs[2].getX(), bottomPs[2].getY());
        right.lineTo(topPs[0].getX(), topPs[0].getY() + 3);
        right.closePath();
        this.rightSite = new Area(right);

        arcMiddle = calculateArcMiddle();

        // Label position: 五分之四处
        Point2D c = getPieCenter();
        // Point2D m = getChordMiddle();
        Point2D m = arcMiddle;
        double dis = GeometryUtil.distanceOfPoints(c, m) * 0.8;
        labelPosition = GeometryUtil.extentPoint(c, m, dis);
    }

    // 取得Arc上的三个点,在对Arc: center, left, right.
    public static Point2D[] getPointsOfArc(Arc2D arc) {
        Point2D center = new Point2D.Double(arc.getCenterX(), arc.getCenterY());
        Point2D left = arc.getStartPoint();
        Point2D right = arc.getEndPoint();
        Point2D[] points = new Point2D[] { center, left, right };

        return points;
    }

    public Pie getSelectedPie() {
        if (selectedPie == null) {
            selectedPie = createSeletecdPie();
        }

        return selectedPie;
    }

    private Pie createSeletecdPie() {
        // 沿中线方向移动selectedShiftDis个单位
        Point2D c = getPieCenter();
        Point2D m = getChordMiddle();
        Point2D p = GeometryUtil.extentPoint(c, m, selectedShiftDis);

        double deltaX = p.getX() - c.getX();
        double deltaY = p.getY() - c.getY();
        double x = arc.getX() + deltaX;
        double y = arc.getY() + deltaY;

        Arc2D shiftArc = (Arc2D) arc.clone();
        shiftArc.setFrame(x, y, arc.getWidth(), arc.getHeight());

        return new Pie(shiftArc, color, value, shadowDepth, selectedShiftDis);
    }

    public Arc2D getArc() {
        return arc;
    }

    public Area getFrontSite() {
        return frontSite;
    }

    public Area getLeftSite() {
        return leftSite;
    }

    public Area getRightSite() {
        return rightSite;
    }

    public Color getColor() {
        return color;
    }

    public void setColor(Color color) {
        this.color = color;
    }

    public Point2D getLabelPosition() {
        return labelPosition;
    }

    public void setLabelPosition(Point2D labelPosition) {
        this.labelPosition = labelPosition;
    }

    public double getValue() {
        return value;
    }

    public String getLabel() {
        return value + "%";
    }

    // 弦的中心点
    public Point2D getChordMiddle() {
        return GeometryUtil.middlePoint(arc.getStartPoint(), arc.getEndPoint());
    }

    // 饼图的圆心
    public Point2D getPieCenter() {
        return new Point2D.Double(arc.getCenterX(), arc.getCenterY());
    }

    // 弧上的中心点
    public Point2D getArcMiddle() {
        return arcMiddle;
    }

    private Point2D calculateArcMiddle() {
        // 创建一个新的弧,其扩展角度为当前弧的一半
        return new Arc2D.Double(arc.getX(), arc.getY(), arc.getWidth(), arc.getHeight(),
            arc.getAngleStart(), arc.getAngleExtent() / 2, Arc2D.PIE).getEndPoint();
    }
}

import java.awt.Color;
import java.awt.FontMetrics;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.RenderingHints;
import java.awt.Toolkit;
import java.awt.event.MouseAdapter;
import java.awt.event.MouseEvent;
import java.awt.geom.Arc2D;
import java.util.ArrayList;
import java.util.List;

import javax.swing.JFrame;
import javax.swing.JPanel;

/**
 * 绘制3D效果的饼图
 * 
 * @author Biao
 */
@SuppressWarnings("serial")
public class Pie3DPainter extends JPanel {
    private double[] data; // 在饼图中显示的数据
    private Color[] defaultColors; // 预定义饼图的颜色
    private Pie[] pies;

    private int shadowDepth = 8;
    private int shiftAngle = -30;
    private int selectedPieIndex = -1; // 鼠标点击是选中的Arc, -1为没有选中

    public Pie3DPainter() {
        data = new double[] { 20.72, 6.56, 3.74, 10.26, 15.38, 5.69, 10.72, 15.38, 6.15, 18.0 };
        defaultColors = createColors();

        int x = 50;
        int y = 50;
        int w = 380;
        int h = (int) (w * 0.618); // 黄金分割
        pies = createPies(x, y, w, h, shadowDepth, shiftAngle, data, defaultColors);

        // 取得鼠标选中的饼图的下标
        addMouseListener(new MouseAdapter() {
            @Override
            public void mouseClicked(MouseEvent e) {
                selectedPieIndex = -1;
                for (int i = 0; i < pies.length; ++i) {
                    if (pies[i].getArc().contains(e.getX(), e.getY())) {
                        selectedPieIndex = i;
                        break;
                    }
                }
                repaint();
            }
        });
    }

    private Color[] createColors() {
        // 返回16进制的值颜色
        List<Color> colors = new ArrayList<Color>();
        colors.add(Color.decode("#FF7321"));
        colors.add(Color.decode("#169800"));
        colors.add(Color.decode("#00E500"));
        colors.add(Color.decode("#D0F15A"));
        colors.add(Color.decode("#AA6A2D"));
        colors.add(Color.decode("#BFDD89"));
        colors.add(Color.decode("#E2FF55"));
        colors.add(Color.decode("#D718A5"));
        colors.add(Color.decode("#00DBFF"));
        colors.add(Color.decode("#00FF00"));

        return colors.toArray(new Color[0]);
    }

    public static Pie[] createPies(int x,
                                   int y,
                                   int w,
                                   int h,
                                   int shadowDepth,
                                   double shiftAngle,
                                   double[] data,
                                   Color[] colors) {
        double sum = 0;
        for (double d : data) {
            sum += d;
        }

        // 初始化Pies
        double arcAngle = 0;
        double startAngle = shiftAngle;
        Pie[] pies = new Pie[data.length];

        for (int i = 0; i < data.length; ++i) {
            arcAngle = data[i] * 360 / sum; // 使用百分比计算角度
            if (i + 1 == data.length) {
                arcAngle = 360 + shiftAngle - startAngle; // 保证闭合
                arcAngle = arcAngle > 0 ? arcAngle : 0;
            }

            Arc2D.Double arc = new Arc2D.Double(x, y, w, h, startAngle, arcAngle, Arc2D.PIE);
            pies[i] = new Pie(arc, colors[i % colors.length], data[i], shadowDepth, 30);
            startAngle += arcAngle;
        }

        return pies;
    }

    @Override
    protected void paintComponent(Graphics g) {
        super.paintComponent(g);
        Graphics2D g2d = (Graphics2D) g;
        g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);

        if (pies != null) {
            drawPies(g2d, pies, selectedPieIndex);
        }
    }

    private void drawPies(Graphics2D g2d, Pie[] pies, int selectedIndex) {
        int startIndex = 0; // 从第几个饼图开始绘制
        int endIndex = pies.length; // 要画的饼图的数量.
        boolean closed = (endIndex - startIndex == pies.length) ? true : false;
        boolean selected = (selectedIndex >= startIndex && selectedIndex < endIndex) ? true : false;
        FontMetrics metrics = g2d.getFontMetrics();

        // 一次性绘制完3D效果,然后再绘制饼图的效果比绘制饼图的同时绘制好
        for (int i = startIndex; i < endIndex; ++i) {
            if (i != selectedIndex) {
                Pie p = pies[i];
                g2d.setColor(p.getColor().darker());
                g2d.fill(p.getFrontSite());
            }
        }

        // 如果没有闭合时,且选中的不是第一块,则第一块画左面
        if (!closed && selectedIndex != startIndex) {
            g2d.setColor(pies[startIndex].getColor().darker());
            g2d.fill(pies[startIndex].getLeftSite());
        }

        // 如果没有闭合时,且选中的不是最后一块,则最后一块画右面
        if (!closed && selectedIndex + 1 != endIndex) {
            g2d.setColor(pies[endIndex - 1].getColor().darker());
            g2d.fill(pies[endIndex - 1].getRightSite());
        }

        // 有饼图被选中
        if (selected) {
            int prevIndex = selectedIndex > startIndex ? (selectedIndex - 1) : endIndex - 1;
            int nextIndex = (selectedIndex + 1) >= endIndex ? startIndex : (selectedIndex + 1);

            // 前一个画右墙
            g2d.setColor(pies[prevIndex].getColor().darker());
            g2d.fill(pies[prevIndex].getRightSite());
            // 后一个画左墙
            g2d.setColor(pies[nextIndex].getColor().darker());
            g2d.fill(pies[nextIndex].getLeftSite());
        }

        // 最后再绘制饼图的上面部分,把不需要的部分隐藏掉
        for (int i = startIndex; i < endIndex; ++i) {
            if (i != selectedIndex) {
                Pie p = pies[i];
                g2d.setColor(p.getColor());
                g2d.fill(p.getArc());

                int sw = metrics.stringWidth(p.getLabel()) / 2;
                int sh = (metrics.getAscent()) / 2;
                int x = (int) (p.getLabelPosition().getX() - sw);
                int y = (int) (p.getLabelPosition().getY() + sh);
                g2d.setColor(Color.BLACK);
                g2d.drawString(p.getLabel(), x, y);
            }
        }

        // 绘制被选中的饼图
        if (selected) {
            Pie p = pies[selectedIndex].getSelectedPie();
            g2d.setColor(p.getColor().darker());
            g2d.fill(p.getFrontSite());
            g2d.fill(p.getLeftSite());
            g2d.fill(p.getRightSite());
            g2d.setColor(p.getColor());
            g2d.fill(p.getArc());

            int sw = metrics.stringWidth(p.getLabel()) / 2;
            int sh = (metrics.getAscent()) / 2;
            int x = (int) (p.getLabelPosition().getX() - sw);
            int y = (int) (p.getLabelPosition().getY() + sh);
            g2d.setColor(Color.BLACK);
            g2d.drawString(p.getLabel(), x, y);
        }
    }

    private static void createGuiAndShow() {
        JFrame frame = new JFrame("Pie with 3D Effect");
        frame.getContentPane().add(new Pie3DPainter());

        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        int sw = Toolkit.getDefaultToolkit().getScreenSize().width;
        int sh = Toolkit.getDefaultToolkit().getScreenSize().height;
        int w = 500;
        int h = 400;
        int x = (sw - w) / 2;
        int y = (sh - h) / 2 - 40;
        x = x > 0 ? x : 0;
        y = y > 0 ? y : 0;
        frame.setBounds(x, y, w, h);
        frame.setVisible(true);
    }

    public static void main(String[] args) {
        createGuiAndShow();
    }
}



  • Pie.zip (19.3 KB)
  • 下载次数: 558
  • 大小: 53.5 KB
  • 大小: 56.7 KB
分享到:
评论
12 楼 hk8082 2011-04-27  
swing一直用不好
11 楼 vivia 2011-04-27  
addMouseMotionListener(new MouseAdapter() {

@Override
public void mouseMoved(MouseEvent e) {
super.mouseMoved(e);
selectedPieIndex = -1;
                for (int i = 0; i < pies.length; ++i) {
                    if (pies[i].getArc().contains(e.getX(), e.getY())) {
                        selectedPieIndex = i;
                        break;
                    }
                }
                repaint();
}
       
});
鼠标悬停时展开块感觉效果更好
10 楼 diggywang 2011-04-27  
jorneyR 写道
skzr.org 写道
jorneyR 写道
skzr.org 写道
哈哈,我看着一大堆java的解决方案可以应用于公司产品,缺少的是java的client,所以也在公司推swing,希望1年后我们团队可以拿出东西到这里分享


《Prentice.Hall.Filthy.Rich.Clients.Aug.2007》这一本书很不错,可惜这段时间没空看完,回去后继续看,不过我自己写桌面软件的时候,更喜欢用Qt,用Java都是写给别人用的,*^o^*


有电子版本的没?
英文不太好,当当上没有这本书,悲剧了
还有推荐的没?

11年重心在团队建设和软件基础建设
12年估计会侧重client的技术革新,swing作webstart,酷炫的应用还是不错

不知道有没有中文版的,我的是英文版,还好,不算难看懂。



这书名字没那么杂,叫《Filthy Rich Clients》,也有中文版的。
书内代码实例在:http://java.net/projects/filthyrichclients/
9 楼 jorneyR 2011-01-13  
skzr.org 写道
jorneyR 写道
skzr.org 写道
哈哈,我看着一大堆java的解决方案可以应用于公司产品,缺少的是java的client,所以也在公司推swing,希望1年后我们团队可以拿出东西到这里分享


《Prentice.Hall.Filthy.Rich.Clients.Aug.2007》这一本书很不错,可惜这段时间没空看完,回去后继续看,不过我自己写桌面软件的时候,更喜欢用Qt,用Java都是写给别人用的,*^o^*


有电子版本的没?
英文不太好,当当上没有这本书,悲剧了
还有推荐的没?

11年重心在团队建设和软件基础建设
12年估计会侧重client的技术革新,swing作webstart,酷炫的应用还是不错

不知道有没有中文版的,我的是英文版,还好,不算难看懂。
8 楼 skzr.org 2011-01-03  
jorneyR 写道
skzr.org 写道
哈哈,我看着一大堆java的解决方案可以应用于公司产品,缺少的是java的client,所以也在公司推swing,希望1年后我们团队可以拿出东西到这里分享


《Prentice.Hall.Filthy.Rich.Clients.Aug.2007》这一本书很不错,可惜这段时间没空看完,回去后继续看,不过我自己写桌面软件的时候,更喜欢用Qt,用Java都是写给别人用的,*^o^*


有电子版本的没?
英文不太好,当当上没有这本书,悲剧了
还有推荐的没?

11年重心在团队建设和软件基础建设
12年估计会侧重client的技术革新,swing作webstart,酷炫的应用还是不错
7 楼 jorneyR 2011-01-03  
skzr.org 写道
哈哈,我看着一大堆java的解决方案可以应用于公司产品,缺少的是java的client,所以也在公司推swing,希望1年后我们团队可以拿出东西到这里分享


《Prentice.Hall.Filthy.Rich.Clients.Aug.2007》这一本书很不错,可惜这段时间没空看完,回去后继续看,不过我自己写桌面软件的时候,更喜欢用Qt,用Java都是写给别人用的,*^o^*
6 楼 zistrong 2011-01-02  
Swing,to be or not
5 楼 skzr.org 2011-01-02  
哈哈,我看着一大堆java的解决方案可以应用于公司产品,缺少的是java的client,所以也在公司推swing,希望1年后我们团队可以拿出东西到这里分享
4 楼 nethaoke 2011-01-02  
不错 学习了
3 楼 003 2011-01-02  
目前国内研究Swing的公司太少了,差距哪
2 楼 hellojinjie 2011-01-02  
从此 javaeye 改名叫 swingeye
1 楼 jorneyR 2011-01-01  
2D去模仿3D的东西,很累啊,差点就想上OpenGL了。

相关推荐

Global site tag (gtag.js) - Google Analytics