0

I'm working on a Django project that ships data via vector tiles to a Vue(tify) frontend. Because of this architecture it is not practical to run Python on Django model instances. Vector tiles are generated inside the database and querysets are not materialized in the Django backend.

Besides, we'd rather ship the data in its raw type and handle formatting in the frontend. From Python I know the Format Specification Mini-Language. Is there an equivalent in JavaScript/Vue/Vuetify?


Example: In Python f"{1/9:.4f}" would result in '0.1111'.


Related: This answer to JavaScript equivalent to printf/String.Format. I'm looking for something more flexible, just like the Format Specification Mini-Language

Stefan_EOX
  • 1,279
  • 1
  • 16
  • 35

1 Answers1

1

The best and most flexible way should be the Inlt, a js namespace with lots of formatters for various data types.

Some examples:

new Intl.NumberFormat().format(12345)
// 12,345

new Intl.NumberFormat('en-US', { maximumSignificantDigits: 4}).format(1.2345678)
// 1.235 (Notice the rounding)

new Intl.NumberFormat('en-GB', { style: 'currency', currency: 'GBP' }).format(9002.20)
// £9,002.20

new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(9002.20)
// 9.002,20 €

new Intl.NumberFormat().formatToParts(12345.678)
/*
[
   { "type":"integer", "value":"12" },
   { "type":"group", "value":"," },
   { "type":"integer", "value":"345" },
   { "type":"decimal", "value":"." },
   { "type":"fraction", "value":"678" }
]

(ref)

new Intl.DateTimeFormat('default', {
  hour: 'numeric',
  minute: 'numeric',
  second: 'numeric'
}).format(date)
// → '2:00:00 pm

new Intl.DateTimeFormat('en-US', {
  year: 'numeric',
  month: 'numeric',
  day: 'numeric'
}).format(date)
// → '12/19/2012'

(ref)

Cosimo Chellini
  • 1,560
  • 1
  • 14
  • 20