This is second post for using chart in android.
First chart is 'Google chart'. click to my post.
This post introduce 'Smoothie chart'.
Smoothie chart is realtime chart.
So if you want show realtime data, using this chart.
Smoothie chart page is here!!
You will get library file!!
Click this button and all select text and copy.
And make this file project/assets/www/smoothie.js in eclipse and paste text.
And then make html file, example index2.html my case.
This is html code.
- <!DOCTYPE html>
- <html>
- <head>
- <script type="text/javascript" src="smoothie.js"></script>
- <script type="text/javascript">
- var arr;
- var line = new TimeSeries();
- function setMessage(msg){
- arr=1;
- filter=msg.split('|');
- arr*=filter[1];
- document.getElementById("title").innerHTML=filter[0]; //input name
- }
- function createTimeline(msg) {
- var chart = new SmoothieChart({
- millisPerPixel:50,
- grid:{fillStyle:'#ffffff'},
- labels:{fillStyle:'#000000',precision:1},
- timestampFormatter:SmoothieChart.timeFormatter
- });
- // Add a random value to each line every second
- setInterval(function() {
- line.append(new Date().getTime(), arr); //input data
- }, 1000);
- // Add to SmoothieChart
- chart.addTimeSeries(line,{
- strokeStyle:'rgb(0, 255, 0)',
- lineWidth:3,
- fillStyle:'rgba(0,0,0,0.30)'});//config line
- chart.streamTo(document.getElementById("chart"), 1000); //draw
- }
- </script>
- </head>
- <body onload="createTimeline()">
- <p>Show Chart!!</p>
- <p id="title"></p>
- <canvas id="chart" width="500" height="200"></canvas>
- </body>
- </html>
And Java code is similar to google chart.
This is java code.
- private void init() {
- chart=(WebView)findViewById(R.id.chart);
- chart.getSettings().setJavaScriptEnabled(true);
- chart.loadUrl(url);
- chart.loadUrl("javascript:setMessage('" + sendChart + "')");
- }
Don't need an array data!!
Look at smoothie Chart!
No comments:
Post a Comment