<rt id="bn8ez"></rt>
<label id="bn8ez"></label>

  • <span id="bn8ez"></span>

    <label id="bn8ez"><meter id="bn8ez"></meter></label>

    TWaver - 專注UI技術

    http://twaver.servasoft.com/
    posts - 171, comments - 191, trackbacks - 0, articles - 2
      BlogJava :: 首頁 :: 新隨筆 :: 聯系 :: 聚合  :: 管理

    用TWaver實現組合的Chart

    Posted on 2013-01-21 10:38 TWaver 閱讀(1810) 評論(0)  編輯  收藏
    TWaver組件中提供了一些通用的Chart,比如Line Chart,Bar Chart,Bubble Chart,Percent Chart等,對于一些復雜的Chart我們也可以通過定制的方式來實現,如前面所給出的用swing制作精美ERP圖表,仔細看來這些Chart都是單個圖,有客戶要實現多個Chart的整合,比如Line Chart和Bar Chart組合顯示,這改如何來實現?通常我們想到的方式是通過疊加來顯示,將TWaver的這兩個組件疊加起來,但這會帶來很多不必要的麻煩,下面我們通過定制Chart的方式來實現,先看看最終的實現效果:
    這個圖展示的是2012年下半年的降雨量和溫度走勢,這就是一個很簡單的Line Chart和Bar Chart疊加的圖,這里采取的實現方式是定制Chart,首先創建一個類繼承于Bar Chart,在Bar Chart上draw出Line Chart,主要的實現代碼也就是在PaintChart里,我們來看看具體的代碼實現:

     1 public void paintChart(Graphics2D g2d, int width, int height) {
     2     super.paintChart(g2d, width, height);
     3     Rectangle rect = this.getBackgroundBounds();
     4     double xScaleGap = rect.getWidth()/(xScaleCount*2+1);
     5     double yPixelGap = this.toValidHeight(rect.getHeight())/ this.lineRange;
     6     for(int i = 0; i< lineDatas.size(); i++){
     7         Data data = (Data)lineDatas.get(i);
     8         paintData(g2d,data,rect,xScaleGap,yPixelGap);
     9     }
    10 }
    11 

     1 private void paintData(Graphics2D g2d,Data data,Rectangle rect,double xScaleGap, double yPixelGap){
     2         List dataValues = data.getValues();
     3         Point2D lastPoint = null;
     4         Point2D currentPoint = null;
     5         g2d.setColor(data.getColor());
     6         g2d.setStroke(new BasicStroke(data.getLineWidth()));
     7         if(dataValues != null && dataValues.size() >0){
     8             for(int i=0 ;i < xScaleCount; i++){
     9                 double value = ((Double) dataValues.get(i)).doubleValue();
    10                 double x = rect.getX() - this.shadowOffset + xScaleGap * (2*(i+1)-0.5);
    11                 double y = rect.getY() + this.toValidHeight(rect.height) - value*yPixelGap;
    12                 currentPoint = new Point2D.Double(x,y);
    13                 if(lastPoint != null){
    14                     Line2D line = new Line2D.Double(lastPoint,currentPoint);
    15                     g2d.draw(line);
    16                 }
    17                 Shape shape = new Rectangle2D.Double(x-2, y-2,4,4);
    18                 g2d.fill(shape);
    19                 g2d.drawString(formatLineValue(value), ((Double)x).floatValue(), ((Double)y).floatValue());
    20                 lastPoint = currentPoint;
    21             }
    22         }
    23     }

    paint方法中主要是通過獲取Bar Chart的背景大小,來計算出x軸刻度的間隙和Y軸像素的間隙,這樣在繪制Line Chart上每個值的具體坐標時就比較容易了。其中我們還定義了Data這樣一個實體bean,用于存放line chart上顯示的數值,主要給出了line chart每條線的顏色和粗細以及具體的值這些參數,我們可以根據實際需求加上自己所需的參數,比如是否顯示lineChart上的值,值的顏色,字體,大小,當然還可以實現雙Y坐標軸,在右方draw出lineChart的坐標軸等。 最后給出上圖實現效果的具體代碼:

    lineAndBarChart

    只有注冊用戶登錄后才能發表評論。


    網站導航:
     
    主站蜘蛛池模板: 全部一级一级毛片免费看| 成年女人男人免费视频播放| 永久免费无码日韩视频| 成年在线网站免费观看无广告| 亚洲经典在线中文字幕| 鲁丝片一区二区三区免费| 亚洲中文字幕无码不卡电影| av电影在线免费看| 中文国产成人精品久久亚洲精品AⅤ无码精品 | 中文字幕视频免费在线观看 | 成人免费av一区二区三区| 伊人婷婷综合缴情亚洲五月| 精品无码一级毛片免费视频观看 | 亚洲乱妇熟女爽到高潮的片 | 成人黄页网站免费观看大全| 亚洲日本久久久午夜精品| 日本最新免费不卡二区在线| 亚洲gay片在线gv网站| jjzz亚洲亚洲女人| igao激情在线视频免费| 亚洲avav天堂av在线不卡| 美女视频黄的全免费视频| 亚洲欧美日韩中文字幕一区二区三区 | 亚洲愉拍99热成人精品热久久 | 亚洲av女电影网| 午夜性色一区二区三区免费不卡视频| 2020国产精品亚洲综合网| 国产精品无码一二区免费| 国产美女视频免费观看的网站| 亚洲国产成人私人影院| 成年丰满熟妇午夜免费视频| 免费激情网站国产高清第一页| 亚洲国产成人一区二区三区| www.999精品视频观看免费| 无遮挡a级毛片免费看| 亚洲国产精品久久久久久| 国产在线a免费观看| 国产精品视频全国免费观看| 亚洲一区二区三区播放在线 | 国产精品亚洲а∨无码播放| 中国在线观看免费国语版|