Android实现绘制折线图APP代码

目录
  • 一.总体设计
  • 二.具体模块实现
  • 三.效果展示
  • 四.功能展望
  • 总结

一.总体设计

1.寻找规律,公式化的生成坐标系。

2.将生成坐标系的关键参数设置为可自定义,从而可变的可以生成自己想要的坐标系。

3.将需要绘制的点绘制在坐标系中并生成折现图。

二.具体模块实现

1.坐标系的生成:

    public void chart(){
        imageView=(ImageView)findViewById(R.id.image);
        newb = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
        canvasTemp = new Canvas(newb);
        //Canvas canvasTemp2=new Canvas(newb);
        canvasTemp.drawColor(Color.TRANSPARENT);
        p = new Paint();
        //防锯齿
        p.setAntiAlias(true);
        p.setStyle(Paint.Style.STROKE);//STROKE,FILL
        p.setStrokeWidth(5);
        p.setColor(Color.LTGRAY);
        p.setTextAlign(Paint.Align.CENTER);
        p.setTextSize(40);
        p.setColor(Color.BLACK);
        p.setStyle(Paint.Style.FILL);//STROKE,FILL
        p.setStrokeWidth(2);
        p2=p;
        //绘制表格
        canvasTemp.drawText("0", startx1-10, starty1+30, p);//原点
        canvasTemp.drawLine(startx1,starty1, endx1+50,starty1,p);// 绘制x轴
        canvasTemp.drawText("x", endx1+50+10, starty1+35, p);  //标记x轴
        canvasTemp.drawLine(startx1,starty1, startx1,endy1-50,p);// 绘制y轴
        canvasTemp.drawText("y", startx1-15,endy1-50, p);  //标记y轴
        //绘制x y轴箭头
        canvasTemp.drawLine(endx1+50,starty1, endx1+50-10,starty1-10,p);
        canvasTemp.drawLine(endx1+50,starty1, endx1+50-10,starty1+10,p);
        canvasTemp.drawLine(startx1,endy1-50, startx1-10,endy1-50+10,p);
        canvasTemp.drawLine(startx1,endy1-50, startx1+10,endy1-50+10,p);
        //绘制x轴间隔线
        for(int i=1;i<=allX;i++){
            canvasTemp.drawLine(startx1+xinterval*i,starty1, startx1+xinterval*i,starty1-10,p);
            if(allX>30){
                p2.setTextSize(20);
            }
            canvasTemp.drawText(String.valueOf(i), startx1+xinterval*i, starty1+35, p2);
        }
        //绘制y轴间隔线
        for(int i=1;i<=allY;i++){
            canvasTemp.drawLine(startx1,starty1-yinterval*i, startx1+10,starty1-yinterval*i,p);
            if(allX>25){
                p2.setTextSize(20);
            }else{
                p2.setTextSize(35);
                canvasTemp.drawText(String.valueOf( (i*fully/allY)), startx1-55, starty1-yinterval*i+10, p2);
            }
        }
        imageView.setImageBitmap(newb);
    }

2.自定义坐标系参数获取并绘制:

 public void comfir(View view) {
        EditText numberx=(EditText)findViewById(R.id.numberx);
        EditText numbery=(EditText)findViewById(R.id.numbery);
        EditText maxy=(EditText)findViewById(R.id.maxy);
        if(!numberx.getText().toString().trim().equals("")&&!numbery.getText().toString().trim().equals("")&&!maxy.getText().toString().trim().equals("")){
            /*//判断输入框中内容是否为空的错误方法:
            numberx.getText()!=null;
            numberx.getText().toString()!=null;
            numberx.getText().toString().equals("");*/
            allX= Integer.valueOf(String.valueOf(numberx.getText()));
            allY= Integer.valueOf(String.valueOf(numbery.getText()));
            fully= Integer.valueOf(String.valueOf(maxy.getText()));
            xinterval=(endx1-startx1)/allX;
            yinterval=(starty1-endy1)/allY;
            //rule1=(starty1-endy1)/allY;
            //rule2=(starty1-endy1)/fully;
            mypoint=new float[allX];
            all=0;
            chart();
        }
    }

3.将输入的点绘制在坐标系中:

 public void paint(View view) {
        EditText point=(EditText)findViewById(R.id.point);
        if(all==fully){
            Toast.makeText(this,"已达最大x值",Toast.LENGTH_SHORT).show();
            point.setText("");
        }else{
            if(!point.getText().toString().trim().equals("")){
                thispoint=Float.valueOf(String.valueOf(point.getText()));
                if(thispoint>fully){
                    Toast.makeText(this,"大于最大y值,请重新输入!",Toast.LENGTH_SHORT).show();
                    point.setText("");
                }else{
                    mypoint[all]=thispoint;
                    x2=startx1+xinterval*(all+1);
                    y2=starty1-thispoint/fully*rule1;
                    p.setStrokeWidth(10);
                    canvasTemp.drawPoint(x2,y2,p);
                    if(all>0){
                        p.setStrokeWidth(5);
                        canvasTemp.drawLine(x1,y1,x2,y2,p);
                    }
                    all++;
                }
                x1=x2;
                y1=y2;
            }
        }
        point.setText("");
    }

三.效果展示

”确认”键上面三个参数可实现对坐标系的自定义。“清除所有”按钮会将折线图清除,不会将坐标系也清除。

四.功能展望

1.多个折现图同时展示。

2.加入颜色元素增加美观性。

3.更改或优化折线图数据输入方式。

总结

到此这篇关于Android实现绘制折线图APP代码的文章就介绍到这了,更多相关Android绘制折线图内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • Android自定义控件实现折线图

    本文实例实现一个如下图所示的Android折线图,供大家参考,具体内容如下 首先是控件绘图区域的划分,控件左边取一小部分(控件总宽度的八分之一)绘制表头,右边剩余的部分绘制表格 确定表格的行列数,首先绘制一个三行八列的网格,设置好行列的坐标后开始绘制 /*绘制三条横线*/ for(int i=0;i<3;i++){ canvas.drawLine(textWide, mLineYs[i], totalWidth, mLineYs[i], mPaintLine); } /*绘制八条竖线*/ for

  • Android绘制动态折线图

    所谓动态折线图,就是折线图能随着手指的滑动进行动态绘制,这里很定会产生动画效果.基于这个效果,这里使用SurfaceView进行制图. 实现步奏如下: (1): 这里新建一个绘图ChartView,继承SurfaceView并实现SurfaceHolder.Callback , Runnable接口,主要绘图工作在子线程中完成. (2):现实 SurfaceHolder.Callback接口的三个方法,并在 surfaceCreated中开启子线程进行绘图. (3):重写onTouchEvent

  • Android自定义可左右滑动和点击的折线图

    前言 前几天有小盆友让我写一个折线图,可以点击,可以左右滑动.对于折线肯定有很多项目都使用过,所以网上肯定也有很多demo,像AndroidChart.HelloChart之类的,功能相当丰富,效果也很赞,但是太重了,其他的小demo又不符合要求,当然了,我写的自定义折线图的思想也有来自这些小demo,对他们表示感谢. 效果图 废话不多说,先上效果图: 效果是不是很赞,如果上图满足你的需求,那就继续往下看. 自定义折线图的步骤: 1.自定义view所需要的属性 确定所需要的自定义view的属性,

  • Android开发自定义控件之折线图实现方法详解

    本文实例讲述了Android开发自定义控件之折线图实现方法.分享给大家供大家参考,具体如下: 前言 折线图是Android开发中经常会碰到的效果,但由于涉及自定义View的知识,对许多刚入门的小白来说会觉得很高深.其实不然,接下来我就以尽量通俗的语言来说明下图折线图效果的实现过程. 效果图 实现过程 首先,选择自定义控件的方式. 自定义控件的实现有四种方式: 1.继承View,重写onDraw.onMeasure等方法. 2.继承已有的View(比如TextView). 3.继承ViewGrou

  • Android实现绘制折线图APP代码

    目录 一.总体设计 二.具体模块实现 三.效果展示 四.功能展望 总结 一.总体设计 1.寻找规律,公式化的生成坐标系. 2.将生成坐标系的关键参数设置为可自定义,从而可变的可以生成自己想要的坐标系. 3.将需要绘制的点绘制在坐标系中并生成折现图. 二.具体模块实现 1.坐标系的生成: public void chart(){ imageView=(ImageView)findViewById(R.id.image); newb = Bitmap.createBitmap(w, h, Bitma

  • PHP中使用GD库绘制折线图 折线统计图的绘制方法

    在PHP中,有一些简单的图像函数是可以直接使用的,但大多数要处理的图像,都需要在编译PHP时加上GD库.除了安装GD库之外,在PHP中还可能需要其他的库,这可以根据需要支持哪些图像格式而定.GD库可以在http://www.boutell.com/gd/免费下载,不同的GD版本支持的图像格式不完全一样,最新的GD库版本支持GIF.JPEG.PNG.WBMP.XBM等格式的图像文件,此外还支持一些如FreeType.Type 1等字体库.通过GD库中的函数可以完成各种点.线.几何图形.文本及颜色的

  • Android实现绘制LocationMarkerView图的示例代码

    目录 LocationMarkerView图的绘制 绘制整公里的文字 添加动画 LocationMarker是运动轨迹上Start.End, 以及整公里点上笔者自定义绘制的一个MarkerView, 当时之所以没有用设计给的icon是这个MarkerView里需要填充动态的数字,自定义的话自主性比较大些也方面做动画,之前的Android 传统自定义View的实现可以看这篇文章介绍 运动App自定义LocationMarker. 这里先看下gif动图: LocationMarkerView图的绘制

  • python使用matplotlib绘制折线图的示例代码

    示例代码如下: #!/usr/bin/python #-*- coding: utf-8 -*- import matplotlib.pyplot as plt # figsize - 图像尺寸(figsize=(10,10)) # facecolor - 背景色(facecolor="blue") # dpi - 分辨率(dpi=72) fig = plt.figure(figsize=(10,10),facecolor="blue") #figsize默认为4,

  • Android 实现自定义折线图控件

    目录 前言 概述 原点 计算Y轴宽度 计算X轴高度 X轴 绘制轴线 X轴刻度间隔 网格线.文本 Y轴 计算Y轴分布 刻度间隔.网格线.文本 折线 代码 前言 日前,有一个“折现图”的需求,如下图所示: 概述 如何自定义折线图?首先将折线图的绘制部分拆分成三部分: 原点 X轴 Y轴 折线 原点 第一步,需要定义出“折线图”原点的位置,由图得: 可以发现,原点的位置由X轴.Y轴所占空间决定: OriginX:Y轴宽度 OriginY:View高度 - X轴高度 计算Y轴宽度 思路:遍历Y轴的绘制文字

  • Android实现双曲线折线图

    本文实例为大家分享了Android实现双曲线折线图的具体代码,供大家参考,具体内容如下 先看一下效果图 1.先下载jar包 mpandroidchartlibrary-2-1-6.jar 2.将jar包导入到libs文件夹中 3.在build.gradle中依赖 dependencies {     .....       compile files('libs/mpandroidchartlibrary-2-1-6.jar') } 4.创建LineChartManager工具类 public

  • JS+html5 canvas实现的简单绘制折线图效果示例

    本文实例讲述了JS+html5 canvas实现的简单绘制折线图效果.分享给大家供大家参考,具体如下: 1.实例代码: <!DOCTYPE html> <html> <head> <meta charset='utf-8'> <title>画图</title> <style> #divContainer{ margin-top: 20px; text-align: center; } #cv{ width: 300px;

  • jquery.flot.js简单绘制折线图用法示例

    本文实例讲述了jquery.flot.js简单绘制折线图用法.分享给大家供大家参考,具体如下: 1.完整实例代码: <!DOCTYPE html> <html> <head> <meta charset='utf-8'> <title>折线图</title> <!--[if lte IE 8]> <script language="javascript" type="text/javas

  • PHP使用JpGraph绘制折线图操作示例【附源码下载】

    本文实例讲述了PHP使用JpGraph绘制折线图操作.分享给大家供大家参考,具体如下: 下载jpgraph类库,使用的是src目录下的类文件. require_once './src/jpgraph.php'; require_once './src/jpgraph_line.php'; //创建统计图对象,宽,高 $graph = new Graph(1993, 766); //设置背景,注意要把主题给换掉 $graph->SetBackgroundImage('./bg.jpg',2); /

随机推荐