Как получить каждый массив obj как строку с кавычками? - PullRequest
0 голосов
/ 06 апреля 2020

У меня есть массив

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

Чего мне не хватает?

ОБНОВЛЕНИЕ

Что я пытаюсь сделать, это напечатать серию дат на графике. 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'/>

1 Ответ

1 голос
/ 06 апреля 2020

Может быть

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, фактически передавая массив с одним элементом, который также был массивом, поэтому все ваши даты показывали stacked в слева

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>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...