visjs / vis-timeline

📅 Create a fully customizable, interactive timelines and 2d-graphs with items and ranges.
https://visjs.github.io/vis-timeline/
Other
1.74k stars 302 forks source link

[Feature Request] Show all the group items on the same line #1770

Closed GabrielGonMorais closed 2 months ago

GabrielGonMorais commented 4 months ago

Hi! Well, working with the vis-timeline, I see the items distribution look like this:

Captura de Tela 2024-02-28 às 18 09 07

But, I would love to see the items like this:

Captura de Tela 2024-02-28 às 18 08 27

I tried to put these three items on the same line with css, but groups height still large. To fix it, I would have to change all the timeline structure.

The expected result would be like this:

Captura de Tela 2024-02-28 às 18 14 33

Could this be a featuring?

Thank you guys!

alexdeia commented 4 months ago

Hi! Stack option in Configuration Options is not the same?

stack boolean true If true (default), items will be stacked on top of each other such that they do not overlap.
GabrielGonMorais commented 4 months ago

Hi! Stack option in Configuration Options is not the same?

stack boolean true If true (default), items will be stacked on top of each other such that they do not overlap.

unfortunately doens't work (value 'pt' in the locale parameter doens't work too)

Captura de Tela 2024-02-29 às 09 52 24

Captura de Tela 2024-02-29 às 09 52 14

version: "vis-timeline": "7.7.3"

alexdeia commented 4 months ago

Why do you use true value for stack? It is a default value. So in your screenshot the tasks are really stacked.

Try

const timelineOptions = {
  stack: false
}

Official example from documentation https://visjs.github.io/vis-timeline/examples/timeline-generated/codepen.cd241505bf80e03e6b96c4b8aa197e6b07591e7162df44cd75e72362318f3e0f.html

image

About locale - pt-BR works.

image

Just use moment locale like this:

import 'moment/dist/locale/pt-br.js'

const timelineOptions = {
  moment(date: Date) {
    moment.locale('pt-BR')

    return moment(date)
  },
}

You don't have to change the locale prop in timeline options.

GabrielGonMorais commented 2 months ago

Thank You! @alexdeia