jquery - 如何向莫里斯条形图添加动态数据

标签 jquery ajax morris.js

我想通过 ajax 将数据添加到 Morris 条形图。以下是我在ajax成功中获得的json

[{"x":"2014-10-02","y":"1"},{"x":"2014-10-19","y":"1"} ,{"x":"2014-10-20","y":"1"},{"x":"2014-11-13","y":"1"}]

下面是js代码

var chart = Morris.Bar({
        element : 'normal-bar-graph',
        data : [{
            "x" : null,
            "y" : null
        }],
        xkey : 'x',
        ykeys : ['y'],
        labels : ['Added']
    });
$.ajax({
            type: "POST",
            url:  "some_url",
            data: {'user_report':[k,v]},

            success: function(html)                    
            {   
                if(html == "error")
                {
                alert('error');
                }
                else
                {
                    chart.setData(html);

                }
                hide_loading();
            }
        });

正在使用/morris/raphael.2.1.0.min.js/morris/morris.min.jschart.setData(html); 功能无法按照 morris 文档中所述工作。

提前致谢。如有错误请指出。

还制作了一个 jsbin 如果可以帮助的话:morris

最佳答案

删除引号。 setData 需要一个数组。当您使用引号时,它会将其转换为字符串而不是数组。

像这样: chart.setData([{ "y": "2006", "a": 100, "b": 90 },{ "y": "2006", "a": 100 ,“b”:90}]);

关于jquery - 如何向莫里斯条形图添加动态数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32590643/

相关文章:

javascript - Jquery 函数在错误时间提交

javascript - Morris.js 中的周数不正确

jquery - 使用同位素过滤和 InfiniteScroll 加载重复页面/内容

jquery - 使用 jquery 更改数据属性

javascript - 检测数据变化

javascript - token 身份验证 Rest API session

jquery - 使用 jQuery 表单插件和 Spring MVC 提交表单后的成功消息

javascript - 为什么每个 javascript 问题的答案最终都是 "jQuery"

javascript - 当ykey值为0且xkeys为月份时绘制折线图

javascript - morrisjs 折线图未显示第一个 xLabel