问如何将每个数组obj作为带有引号的字符串？
EN

Stack Overflow用户

提问于 2020-04-05 21:14:17

回答 1查看 51关注 0票数 0

我有一个数组

var arr = ["2/3", "3/4", "4/5"];

我需要一个字符串，如："2/3", "3/4", "4/5"

我试过arr.toString()和arr.join(", ")，但是如果我试了，console.log(arr)得到了2/3, 3/4, 4/5

我遗漏了什么？

更新

我要做的是把一系列的日期打印到chart.js xAxis中

data: {
    labels: [arr],

如果我尝试手动设置labels: ["2/3", "3/4", "4/5"],，就可以了

这是我的数组的字面console.log：

4) ["3/13/20", "3/14/20", "3/15/20", "3/16/20"]
0: "3/13/20"
1: "3/14/20"
2: "3/15/20"
3: "3/16/20"

完整代码：

var months = ["gennaio", "febbraio", "marzo", "aprile", "maggio", "giugno", "luglio", "agosto", "settembre", "ottobre", "novembre", "dicembre"];
var datesA = ["3/13/20", "3/14/20", "3/15/20", "3/16/20"];

var config = {
  type: 'line',
  data: {
    labels: [datesA],
    datasets: [{
      fill: false,
      backgroundColor: "rgba(109, 33, 50, 1)",
      data: [

      ],
    }]
  },
  options: {
    responsive: true,
    title: {
      fontSize: 18,
      fontStyle: 'normal',
      display: true
    },
    tooltips: {
      mode: 'index',
      intersect: false
    },
    hover: {
      mode: 'nearest',
      intersect: true
    },
    scales: {
      xAxes: [{
        display: true,
        scaleLabel: {
          display: false
        }
      }],
      yAxes: [{
        display: true,
        scaleLabel: {
          display: false
        },
        ticks: {
          callback: function(value) {
            return Number(value).toLocaleString();
          }
        }
      }]
    },
    elements: {
      line: {
        tension: 0,
        fill: false
      }
    }
  }
};

window.onload = function() {
  var ctxAll = document.getElementById('allDates').getContext('2d');
  window.myLine = new Chart(ctxAll, config);
};

<link href="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.bundle.min.js"></script>
<canvas id='allDates'/>

javascript

jquery

回答 1

Stack Overflow用户

回答已采纳

发布于 2020-04-05 21:21:17

可能是

var arr = ["2/3", "3/4", "4/5"];

var ctx = document.getElementById('chart').getContext('2d');
var chart = new Chart(ctx, {
    // The type of chart we want to create
    type: 'line',

    // The data for our dataset
    data: {
        labels: arr,
        datasets: [{
            label: 'My First dataset',
            backgroundColor: 'rgb(255, 99, 132)',
            borderColor: 'rgb(255, 99, 132)',
            data: [0, 10, 5, 2, 20, 30, 45]
        }]
    },

    // Configuration options go here
    options: {}
});

<link href="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.bundle.min.js"></script>

<canvas id='chart'/>

根据你的编辑：

我将假设datesA是一个数组，其值如下所示。如果是这样的话，唯一的问题是您使用的是[datesA]而不是datesA，它有效地传递了一个数组，这个数组也是一个数组，这就是为什么所有的日期都显示在左边。

var datesA = ["2/3", "3/3", "4/3"];
 var months = ["gennaio", "febbraio", "marzo", "aprile", "maggio", "giugno", "luglio", "agosto", "settembre", "ottobre", "novembre", "dicembre"];
        var config = {
        type: 'line',
        data: {
            labels: datesA,
            datasets: [{
                fill: false,
                backgroundColor: "rgba(109, 33, 50, 1)",
                data: [

                ],
            }]
        },
        options: {
            responsive: true,
            title: {
                fontSize: 18,
                fontStyle: 'normal',
                display: true
            },
            tooltips: {
                mode: 'index',
                intersect: false
            },
            hover: {
                mode: 'nearest',
                intersect: true
            },
            scales: {
                xAxes: [{
                    display: true,
                    scaleLabel: {
                        display: false
                    }
                }],
                yAxes: [{
                    display: true,
                    scaleLabel: {
                        display: false
                    },
                    ticks: {
                        callback: function (value) {
                            return Number(value).toLocaleString();
                        }
                    }
                }]
            },
            elements: {
                line: {
                    tension: 0,
                    fill: false
                }
            }
        }
    };
    window.onload = function() {
        var ctxAll = document.getElementById('allDates').getContext('2d');
        window.myLine = new Chart(ctxAll, config);
    };

<link href="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.css" rel="stylesheet"/>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.bundle.min.js"></script>

<canvas id='allDates'></canvas>