如何将数据加载到javascript中?

时间:2019-03-24 05:47:46

标签: javascript jquery twitter-bootstrap

我有以下Javscript / jquery代码。如何在图表中设置数据值。

Javascript:

$('#graphmodal').on('show.bs.modal', function (event) {
    var a = $(event.relatedTarget); 

    var data_int = a.data('data_int'); 
    var modal2 = $(this);

    var ctx = document.getElementById('chartBartest').getContext('2d');
    new Chart(ctx, {
        type: 'bar',
        data: {
            labels: ['Jul', 'Aug', 'Sept', 'Oct', 'Nov', 'Dec', 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'],
            datasets: [{
                data: [data_int]
            }]
    });
})

HTML:

<a class="btn btn-link" href='#'            
   data-data_int="648, 504, 488, 504, 488, 504, 504, 455, 504, 488, 504, 488"
   data-toggle="modal" 
  data-target="#graphmodal">
  Interest Trends
</a>

1 个答案:

答案 0 :(得分:1)

将您的字符串转换为数组,并将其用于数据,如下所示:

$('#graphmodal').on('show.bs.modal', function (event) {
    var a = $(event.relatedTarget); 

    var data_int = a.data('data_int').split(","); 
    var modal2 = $(this);

    var ctx = document.getElementById('chartBartest').getContext('2d');
    new Chart(ctx, {
        type: 'bar',
        data: {
            labels: ['Jul', 'Aug', 'Sept', 'Oct', 'Nov', 'Dec', 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'],
            datasets: [{
                data: data_int
            }]
    });
})

希望它对您有帮助。