android上动态实现ichartjs & highcharts 的绘图 2D 3D 折线图 柱形图 圆形图 等等
16lz
2021-01-24
项目目录：
Contact.java
package com.example.html5_chart;public class Contact {private String name;private double value;private String color;public Contact(String name, double value, String color) {super();this.name = name;this.value = value;this.color = color;}public String getName() {return name;}public void setName(String name) {this.name = name;}public double getValue() {return value;}public void setValue(double value) {this.value = value;}public String getColor() {return color;}public void setColor(String color) {this.color = color;}} ContactService.java
package com.example.html5_chart;import java.util.ArrayList;import java.util.List;public class ContactService {public List<Contact> getContacts(){List<Contact> contacts = new ArrayList<Contact>();contacts.add(new Contact("IE", 32.85, "#a5c2d5"));contacts.add(new Contact("Chrome", 45.55, "#cbab4f"));contacts.add(new Contact("FireFox", 40.25, "#76a871"));contacts.add(new Contact("Safari", 6.85, "#a56f8f"));contacts.add(new Contact("Other", 1.23, "#6f83a5"));return contacts;}} MainActivity.java
package com.example.html5_chart;import java.util.List;import org.json.JSONArray;import org.json.JSONException;import org.json.JSONObject;import android.os.Bundle;import android.app.Activity;import android.content.Context;import android.util.Log;import android.view.Menu;import android.webkit.WebView;public class MainActivity extends Activity {private static final String TAG = "MainActivity";private ContactService contactService;private WebView webView;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);contactService = new ContactService();webView = (WebView)findViewById(R.id.webView);webView.getSettings().setJavaScriptEnabled(true);webView.getSettings().setBuiltInZoomControls(true);webView.addJavascriptInterface(this, TAG);webView.loadUrl("file:///android_asset/3dchart.html");}public String getContacts(){List<Contact> contacts = contactService.getContacts();String json = null;try {JSONArray array = new JSONArray();for (Contact contact:contacts) {JSONObject object = new JSONObject();object.put("name", contact.getName());object.put("value", contact.getValue());object.put("color", contact.getColor());array.put(object);}json = array.toString();Log.i(TAG, json);System.out.println("json : ------> " + json);//webView.loadUrl("javascript:show("+ json +")");} catch (JSONException e) {e.printStackTrace();}return json;}} 3dchart.html
<!DOCTYPE html><html><head> <meta charset="UTF-8" /> <title>Hello World</title> <meta name="Description" content="" /> <meta name="Keywords" content="" /> <script type="text/javascript" src="ichart.1.2.min.js"></script> <script type="text/javascript"> var data = new Array; var contact = window.MainActivity.getContacts();得到MainActivity中转换出的json字符串 eval('data=' + contact);得到json数据 $(function(){ new iChart.Column3D({ render:'canvasDiv',//渲染的Dom目标,canvasDiv为Dom的ID data:data,//绑定数据 title:'Top 5 Browsers in August 2013',//设置标题 showwpercent:true,//显示百分比 decimalsnum:2, width:800,//设置宽度，默认单位为px height:400,//设置高度，默认单位为px shadow:true,//激活阴影 shadow_color:'#c7c7c7',//设置阴影颜色 align:'left', offsetx:50, legend:{ enable:true }, coordinate:{ scale:[{ width:600, position:'left',//配置左值轴 start_scale:0,//设置开始刻度为0 end_scale:40,//设置结束刻度为40 scale_space:8,//设置刻度间距 listeners:{ parseText:function(t,x,y){//设置解析值轴文本 return{text:t+"%"} } } }] } }).draw(); //调用绘制方法开始绘图 }); </script></head><body> <!-- This file lives in public/422.html --> <div id='canvasDiv'>12222</div> <div id='canvasDiv'></div></body></html> 图形：如这样的 由于不可以在模拟器上运行 我就在官网找了一个图片代替了
ichartjs官网：http://www.ichartjs.com/
ichartjs API: http://www.ichartjs.com/docs/zh/
ichartjs例子：http://www.ichartjs.com/gettingstarted/
另外一个库 比这个更加的强悍，功能更加全，效果更加漂亮：http://www.highcharts.com/
更多相关文章
- Android(安卓)判断SD卡是否存在及容量查询
- Android(安卓)开发中，px、dip、density 间的关系，用于多分辨率适配
- Android(安卓)绘制折线和柱状图
- Android计算文件夹大小、文件大小单位转换、删除文件夹及其内容
- Android(安卓)Studion样式中自带的三个item分别代表什么：
- Android/J2SE计算两个位置坐标之间的距离
- textView背景颜色
- android手机屏幕密度的计算及dp、px、sp单位的转换，屏幕适配相关