首页 > 解决方案 > Chart.js 图表位置变量为 0,即使值大于 0

问题描述

我试图通过将值分配给将在图表数据中引用的数组来显示图表。

无论出于何种原因,图表将值注册到数组中,但未在图表中正确定位该值。我认为这与变量的类型有关,所以我尝试强制转换和解析无济于事。

我能做些什么来解决这个问题?

Edit1 - 我可以使用 JSON 变量进行加减运算,因此必须是其他内容,而不是类型问题。

这是我的测试脚本

                var applied = new Array();
                month = ("0" + (date.getMonth() + 1)).slice(-2);
                applied.push(2);
                applied.push(23);
                applied.push(21);
                applied.push(2);
                applied.push(2);
                applied.push(2);
                applied.push(2);
                applied.push(2);
                applied.push(2);
                applied.push(2);
                var json = $.get("../rest/hello?from=01/"+month+"/2018&to=31/"+month+"/2018", function (data){
                    applied.push(parseInt(data);
                    console.log(applied[0]);
                });

这是我的图表脚本

const months = ["January", "February", "March", "April", "May", "June",
                              "July", "August", "September", "October", "November", "December"
                            ];
                        var chartlabels = new Array();
                        for(var i = 11; i > -1; i--){
                            var date = new Date();
                            date.setMonth(date.getMonth()-i)
                            chartlabels.push(months[date.getMonth()]);
                        }
                            var ctx = document.getElementById("approvedtoemployed");
                            var myChart = new Chart(ctx, {
                                type : 'line',
                                data : {
                                    labels: chartlabels,
                                    datasets : [ {
                                        label : '# of approved',
                                        data : applied,
                                        backgroundColor : [
                                                'rgba(255, 99, 132, 0)'
                                                ],
                                        borderColor : [ 
                                            'rgba(255, 99, 132, 1)',
                                                ],
                                        borderWidth : 1
                                    }]
                                },
                                options : {
                                    responsive : false,
                                    maintainAspectRatio : false,
                                    legend: {
                                        display: true,
                                        position: 'bottom',
                                        boxWidth: '15'
                                    },
                                }
                            });

图表图像

数据集中具有 12 个值的图表图像

标签: javascriptchart.js

解决方案


问题必须在于 JSON 数据的加载方式和时间。

图表必须在$.get方法内构建,一旦完成,图表就会正确映射变量。


推荐阅读