javascript - 将 json 加载到 chart.js 中

标签 javascript jquery json ajax

我想通过 ajax 将 jsonData 加载到 chart.js 对象中。

我的问题是将 jsondata 作为字符串引用到 chart.js

我认为 ajax().responseText 检索的是一个字符串,但 chart.js 数据需要一个数组?

我正在对 google chart 做同样的事情,而且效果很好。

这是我的代码:

<html>
    <head>
    <script type="text/javascript" src="./jquery-3.1.1.min.js"></script>
    <script type="text/javascript" src="./jslib.js"></script>
    <script type="text/javascript" src="./Chart.min.js"></script>
    </head>

    <body>
        <div class="container">
          <h2>Chart Test</h2>
          <div>
            <canvas id="myChart"></canvas>
          </div>
        </div>
         <script type="text/javascript">
            var jsonData = $.ajax({
                type: "POST",
                data: { "ibrconfig_id": 26}, 
                url: "./ibrlib.php",
                dataType:"json",
                async: false
                }).responseText;   
            //document.write(jsonData);//   this returns: { labels: ["1","2"], datasets: [ { label: "Taster", data: [0,0], backgroundColor: "rgba(153,255,51,0.6)" } ] }    
            var ctx = document.getElementById('myChart').getContext('2d');
            var myChart = new Chart(ctx, 
            {
                type: 'bar',
                data: jsonData
            });

            /*
            This works very fine
            var ctx = document.getElementById('myChart').getContext('2d');
            var myChart = new Chart(ctx, 
            {
                type: 'bar',
                data: { labels: ["1","2"], datasets: [ { label: "Taster", data: [0,0], backgroundColor: "rgba(153,255,51,0.6)" } ] }
            }); 
            */      
        </script>
    </body>
</html>   

我该如何处理? 非常感谢您的宝贵时间!

最佳答案

好的,我明白了。谢谢安德鲁

我的 jsonData 是错误的。

{ labels: ["1","2"], datasets: [ { label: "Taster", data: [0,0], backgroundColor: "rgba(153,255,51,0.6)" } ] }

不,我把它改成了

 { "labels": ["1","2"], "datasets": [ { "label": "Taster", "data": [0,0], "backgroundColor": "rgba(153,255,51,0.6)" } ] }

关于javascript - 将 json 加载到 chart.js 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42575931/

相关文章:

javascript - 根据属性从数组中删除对象的最佳方法?

javascript - 将哑引号转换为智能引号仅适用于文本而非 HTML 代码

javascript - 在 Controller 和 View 中使用manifest.json (sapui5)

javascript - Jquery 在 Ajax 加载的 Div 上拖放

json - 如何将字符串从 JSON 转换为 Swift 中的对象数组?

javascript - 检查 Typescript/Javascript 中与 "true"、 "false"和 "undefined"相关的 boolean 值

jquery - 如何在 Bootstrap 搜索框中添加搜索和清除图标

php - Codeigniter 分页和 JQuery 操作

android - java.lang.VerifyError : MappingJacksonHttpMessageConverter, 我需要什么 jackson 版本?

java - 使用 PHP 连接到 MySQL 数据库进行 Android 开发