自定义动态生成折线图

package com.example.line;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.PaintFlagsDrawFilter;
import android.util.AttributeSet;
import android.view.View;
public class LineView extends View {
 private final static String X_KEY = "Xpos";
 private final static String Y_KEY = "Ypos";
 private List<Map<String, Integer>> mListPoint = new ArrayList<Map<String, Integer>>();
 Paint mPaint = new Paint();
 public LineView(Context context, AttributeSet attrs, int defStyle) {
  super(context, attrs, defStyle);
 }
 public LineView(Context context, AttributeSet attrs) {
  super(context, attrs);
 }
 public LineView(Context context) {
  super(context);
 }
 @SuppressLint("DrawAllocation")
 @Override
 protected void onDraw(Canvas canvas) {
  super.onDraw(canvas);
  mPaint.setColor(Color.RED);
  mPaint.setAntiAlias(true);
  for (int index = 0; index < mListPoint.size(); index++) {
   if (index > 0) {
    canvas.drawLine(mListPoint.get(index - 1).get(X_KEY),
      mListPoint.get(index - 1).get(Y_KEY),
      mListPoint.get(index).get(X_KEY), mListPoint.get(index)
        .get(Y_KEY), mPaint);
    canvas.setDrawFilter(new PaintFlagsDrawFilter(0,
      Paint.ANTI_ALIAS_FLAG | Paint.FILTER_BITMAP_FLAG));
   }
  }
 }
 /**
  * 设置数据
  * @param curX
  * @param curY
  */
 public void setLinePoint(int curX, int curY) {
  Map<String, Integer> temp = new HashMap<String, Integer>();
  temp.put(X_KEY, curX);
  temp.put(Y_KEY, curY);
  mListPoint.add(temp);
  invalidate();
 }
}
UI类:
package com.example.line;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.annotation.SuppressLint;
import android.app.Activity;
@SuppressLint("HandlerLeak")
public class MainActivity extends Activity {
 private static final int MSG_DATA_CHANGE = 0x11;
 private LineView mLineView;
 private Handler mHandler;
 private int mX = 0;
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  init();
  mHandler = new Handler() {
   @Override
   public void handleMessage(Message msg) {
    switch (msg.what) {
    case MSG_DATA_CHANGE:
     mLineView.setLinePoint(msg.arg1, msg.arg2);
     break;
    }
    super.handleMessage(msg);
   }
  };
  new Thread() {
   @Override
   public void run() {
    for (int index = 0; index < 100; index++) {
     Message message = new Message();
     message.what = MSG_DATA_CHANGE;
     message.arg1 = mX;
     message.arg2 = (int) (Math.random() * 200);
     mHandler.sendMessage(message);
     try {
      sleep(1000);
     } catch (InterruptedException e) {
      // TODO Auto-generated catch block
      e.printStackTrace();
     }
     mX += 10;
    }
   }
  }.start();
 }
 private void init() {
  mLineView = (LineView) findViewById(R.id.line);
 }
}
布局
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >
    <com.example.line.LineView
        android:id="@+id/line"
        android:layout_centerInParent="true"
        android:layout_width="400dp"
        android:layout_height="400dp"
        android:background="#ffffff"
        />
</RelativeLayout>
时间: 2024-11-04 10:21:34

自定义动态生成折线图的相关文章

highcharts实例教程一:结合php与mysql生成折线图

Highcharts是一款纯javascript和html5编写的图表库,不仅几乎能兼容所有pc浏览器,而且对ios和android手机端的兼容 性也不错,它能够很简单便捷的在Web网站或Web应用中添加交互性的图表,Highcharts目前支持直线图.折线图.面积图.柱状图.饼图.散点图 等多达28种不同类型的图表,还支持3D立体图表的生成,可以满足你对Web图表的任何需求 !而且Highcharts对学习者.非商业机构是免费使用的. 案例场景:要求针对技术cto网站,直观地显示一周网站pv.

chart.js插件生成折线图时数据普遍较大时Y轴数据不从0开始的解决办法[bubuko.com]

chart.js插件生成折线图时数据普遍较大时Y轴数据不从0开始的解决办法,原文: 默认情况下如下图 Y轴并不是从0开始,这样折现图的幅度会很大,不是正常的幅度,解决办法如下, 示例代码: window.onload = function () { var ctx = document.getElementById("canvas").getContext("2d"); window.myLine = new Chart(ctx).Line(lineChartDat

使用Highcharts生成折线图_at last

//数据库数据的读取,读取数据后数据格式的转换,还有highchart数据源的配置,伤透了脑筋. anyway,最终开张了.哈哈! 数据库连接:conn_orcale.php <?php $dbconn=oci_connect("dnc-local","dnc-local","orcl")or die("数据库连接错误"); ?> 读取数据:device_query.php <?php require 'co

快速生成折线图及代码详解

快速生成折线图时,只需要修改代码中的以下数据: 1.Y轴刻度个数:Ycounts 2.Y轴最小刻度数:YminValue 3.横坐标:数组mouth 4.标题:strTopic 5.用户数据:数组d 6.[可选]修改背景色:代码中27行改为所需要的颜色即可 完整代码: 1 using System; 2 using System.Collections.Generic; 3 using System.ComponentModel; 4 using System.Data; 5 using Sys

js 动态生成背景图 GeoPattern

以前有个想法,能不能用JS动态创建CANVAS绘制图案当网页背景,在网络发现有现成的别人已经实现的:GeoPattern 代码如下: <!DOCTYPE html> <html> <head> <title>js 生成随机背景图</title> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.min.js"></s

WF4.0以上使用代码完整自定义动态生成执行工作流Xaml文件

给大家分享一下,如何完全使用代码自定义的创建生成工作流文件(用代码创建Xaml文件),并且动态加载运行所生成的工作流. 工作流生成后 在Xaml文件里的主要节点如下: 输入输出参数 <x:Members> <x:Property Name="Item" Type="InArgument(qm:RuleModel)" /> <x:Property Name="Result" Type="OutArgument

JFreeChart应用(生成折线图)

1.jar包,jcommon.jar和jfreechart.jar,具体用哪个版本官网去down吧: 还有另外一个jar包,gnujaxp.jar,这个引入之后编译的时候会报错,应该是xsd校验的问题,索性直接去掉了,不影响实现. 2.具体实现: public static void main(String [] args){ //数据源 String[] rk = getRowKeys(bid); double[][]data = getData(bid,rk); String[] colKe

IOS使用CGContextRef动态画折线图

- (void)drawRect:(CGRect)rect { CGContextRef context = UIGraphicsGetCurrentContext(); CGContextClearRect(context, rect); CGContextSetLineWidth(context, _lineWidth); //设置画笔宽度 CGContextSetFillColorWithColor(context, [[self backgroundColor] CGColor]); /

python生成折线图

图形生成工具包 reportlab (下载地址:https://bitbucket.org/rptlab/reportlab/get/ddf3d4f5066a.zip) 数据地址:ftp://ftp.swpc.noaa.gov/pub/weekly/Predict.txt #! /usr/bin/env python #coding=utf-8 #sunspots_final.py from urllib import request from reportlab.graphics.shapes