Search code examples
morris.js

Morris Chart space between name in "data:"


I am looking for a way to make a break in the display name and it seems impossible to me. I'm right? I mean the data attribute: [{ }]

for example I need a space in name: link nameA/B and I dont want to use link_nameA

       Morris.Area({
      element: 'myfirstchart',
      data: [{
          date: '2021-10-19',
          link nameA: 2,
          link nameB: 3,
          extra: 0
        },
        {
          date: '2021-10-20',
          link nameA: 5,
          link nameB: 4,
          extra: 0
        }
      ],
      xkey: 'date',
      ykeys:  ['link nameA', 'link nameB', 'extra'],
      xLabels: 'day',
      labels: ['link nameA', 'link nameB', 'extra'],
      pointSize: 3,
      fillOpacity: 0,
      pointStrokeColors: ['#00bfc7', '#00bfc7', '#9675ce'],
      behaveLikeLine: true,
      gridLineColor: '#e0e0e0',
      lineWidth: 3,
      hideHover: 'auto',
      lineColors: ['#0bc36e', '#00bfc7', '#9675ce'],
      dateFormat: function(date) {
        d = new Date(date);
        return d.getDate() + '/' + (d.getMonth() + 1) + '/' + d.getFullYear();
      },
      resize: true
    });

is there any way to fulfill my need? because with space script will not working.

thanks.


Solution

  • With JavaScript, object keys can contain spaces if the key is wrapped in quotes.

    const data = {
      "link nameA": "foobar",
    }
    console.log(data['link nameA'])