# Adding a date to a scatterplot - remove locale formatting

**URL:** <https://talk.observablehq.com/t/adding-a-date-to-a-scatterplot-remove-locale-formatting/7241>\
**Category:** Help\
**Created:** [November 3, 2022, 3:24pm UTC](https://talk.observablehq.com/t/adding-a-date-to-a-scatterplot-remove-locale-formatting/7241 "2022-11-03T15:24:21Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![ankakulka](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/ankakulka/32/7125_2.png) [@ankakulka](https://talk.observablehq.com/u/ankakulka)\
**Post date:** [November 3, 2022, 3:24pm UTC](https://talk.observablehq.com/t/adding-a-date-to-a-scatterplot-remove-locale-formatting/7241/1 "2022-11-03T15:24:21Z")

</div>

I’m new to Observablehq and am trying to create a relatively simple scatterplot.

I’ve imported an Excel spreadsheet and parsed the data it contained into a JS array. I’ve managed to work out most things so far, but I am struggling with the **date format**.  
To make things simple, I changed all dates into years (initially the prices in the spreadsheet were divided into yearly quarters but it produced some weird results).

So even the simplified version of the years’ sequence ( **2019, 2020** , and so on) is unfortunately formatted with a `,` (comma) - due to my locale, I presume, although I am not 100% sure.  
It looks really ugly to have `2,019` `2,020` etc 😕

It’s been a while since I’ve dabbled with js, so I’m a bit lost on how to best manage it - [docs](https://observablehq.com/@mbostock/number-formatting) mention `(1234).toLocaleString(undefined, {useGrouping: false})`

So I guess I’d have to iterate over the array to access the `Year` property and strip it of the default formatting using the above mention method…

Or perhaps there’s another way of handling this? 🙃

Any help will be much appreciated 🙂

Snippet of the array

```auto
wtorny = Array(93) [
  0: Object {
  city: "Krakow"
  Year: 2006
  medianPrice: 7114
}
  1: Object {
  city: "Krakow"
  Year: 2007
  medianPrice: 8369
}

```

 ![Observable_2022-11-03_162245_observablehq.com](https://canada1.discourse-cdn.com/flex030/uploads/observablehq/original/2X/0/05ec0e373631eb7a571f88144da94402b277eecf.png)

---

<div class="post-metadata">

**Author:** ![mbostock](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/mbostock/32/9_2.png) [@mbostock](https://talk.observablehq.com/u/mbostock)\
**Post date:** [November 3, 2022, 6:40pm UTC](https://talk.observablehq.com/t/adding-a-date-to-a-scatterplot-remove-locale-formatting/7241/2 "2022-11-03T18:40:33Z")

</div>

It appears you’re using Observable Plot? Here are two solutions that come to mind.

You could define your Year column as Date objects rather than as numbers. For example, use `new Date("2006-01-01")` instead of `2006`. If you have a CSV file, then the string `2006-01-01` (ISO 8601 format) will be converted to a Date automatically when you use {typed: true} or d3.autoType.

Alternatively, you can set the tickFormat on the _x_ scale to the empty string `""` so that thousands grouping is disabled. That would look something like this:

```nohighlight
Plot.plot({
  x: {
    tickFormat: ""
  },
  marks: [
    Plot.lineY(data, {x: "Year", y: "medianPrice", z: "city"})
  ]
})

```

---

<div class="post-metadata">

**Author:** ![ankakulka](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/ankakulka/32/7125_2.png) [@ankakulka](https://talk.observablehq.com/u/ankakulka)\
**Post date:** [November 4, 2022, 7:23am UTC](https://talk.observablehq.com/t/adding-a-date-to-a-scatterplot-remove-locale-formatting/7241/3 "2022-11-04T07:23:28Z")

</div>

I tried the second solution adding the `tickFormat: ""` and it did the trick, yay!

Thanks so much for your help much appreciated 🙇‍♀️ 🙂
