android折线图ichartjs的动态加载数据

论坛 期权论坛     
匿名小用户   2019-10-20 18:38   205   0
<!-- flowchart 箭头图标 勿删 -->
                    <svg style="display: none;">
                        <path d="M5,0 0,2.5 5,5z" id="raphael-marker-block" stroke-linecap="round" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></path>
                    </svg>
                                            <p>之间给大家分享过一个html写的折线图,再将折线图利用webview放在手机中,原来的那个折线图中的x轴坐标在html中已经被写死,这样就带来了操作的不变,代码的灵活性也随之降低。比如,我需要查看今天的温度,可是现在是晚上7点,今天还没有过完,那么问题来了,怎么才能动态的加载这些图的数据呢? <br>
经过查找资料和网上的研究,现在再来和大家分享一下。 <br>
做出来的效果和上一篇是一样的,只不过这个是动态的加载数据。 <br>
我们先需要一个折线图的数据类,就叫它ChartData类吧,在这个类中,定义了折线图折线的名字,x坐标所对应的值和折线的颜色。来看下代码:</p>



<pre class="blockcode"><code class="hljs cs"><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> ChartData {

    String name;
    <span class="hljs-keyword">double</span>[] values;
    String color;

    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title">setName</span>(String name) {
        <span class="hljs-keyword">this</span>.name = name;
    }

    <span class="hljs-keyword">public</span> String <span class="hljs-title">getName</span>() {
        <span class="hljs-keyword">return</span> name;
    }

    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title">setValues</span>(<span class="hljs-keyword">double</span>[] values) {
        <span class="hljs-keyword">this</span>.values = values;
    }

    <span class="hljs-keyword">public</span> <span class="hljs-keyword">double</span>[] <span class="hljs-title">getValues</span>() {
        <span class="hljs-keyword">return</span> values;
    }

    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title">setColor</span>(String color) {
        <span class="hljs-keyword">this</span>.color = color;
    }

    <span class="hljs-keyword">public</span> String <span class="hljs-title">getColor</span>() {
        <span class="hljs-keyword">return</span> color;
    }

}</code></pre>

<p>还需要一个类,用来设置折线图的标题,长度和宽度,当然啦,两个类合在一起也是可以的。代码如下:</p>



<pre class="blockcode"><code class="hljs cs"><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> ChartParameter {

    String title;  
    <span class="hljs-keyword">int</span> width, height;  

    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title">setTitle</span>(String title) {  
        <span class="hljs-keyword">this</span>.title = title;  
    }  

    <span class="hljs-keyword">public</span> String <span class="hljs-title">getTitle</span>() {  
        <span class="hljs-keyword">return</span> title;  
    }  

    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title">setWidth</span>(<span class="hljs-keyword">int</span> width) {  
        <span class="hljs-keyword">this</span>.width = width;  
    }  

    <span class="hljs-keyword">public</span> <span class="hljs-keyword">int</span> <span class="hljs-title">getWidth</span>() {  
        <span class="hljs-keyword">return</span> width;  
    }  

    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title">setHeight</span>(<span class="hljs-keyword">int</span> height) {  
        <span class="hljs-keyword">this</span>.height = height;  
    }  

    <span class="hljs-keyword">public</span> <span class="hljs-keyword">int</span> <span class="hljs-title">getHeight</span>() {  
        <span class="hljs-keyword">return</span> height;  
    }  

}</code></pre>

<p>还需要一个类用于将数据变成json数组,然后跟html进行交互。</p>



<pre class="blockcode"><code class="hljs cs"><span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> JsonPram {

    <span class="hljs-keyword">public</span> <span class="hljs-keyword">static</span> String <span class="hljs-title">PackagePostData</span>(Vector&lt;ChartData&gt; chartdata) {  
        JSONArray root = <span class="hljs-keyword">new</span> JSONArray();  
        <span class="hljs-keyword">try</span>{  
            <span class="hljs-keyword">for</span>(<span class="hljs-keyword">int</span> i = <span class="hljs-number">0</span>; i &lt; chartdata.size(); i++) {  
                JSONObject temp = <span class="hljs-keyword">new</span> JSONObject();  
                temp.put(<span class="hljs-string">"name"</span>, chartdata.<span class="hljs-keyword">get</span>(i).getName());  
                temp.put(<span class="hljs-string">"value"</span>, chartdata.<span class="hljs-keyword">get</span>(i).getValues());  
                temp.put(<span class="hljs-string">"color"</span>, chartdata.<span class="hljs-keyword">get</span>(i).getColor());  
                root.put(temp);   
                System.<span class="hljs-keyword">out</span>.println(t
分享到 :
0 人收藏
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

积分:50
帖子:1079
精华:0
期权论坛 期权论坛
发布
内容

下载期权论坛手机APP