Как сделать вертикальные заголовки столбцов при автоматической генерации столбцов? - PullRequest
3 голосов
/ 27 апреля 2019

как сделать вертикальные заголовки столбцов на автоматическая генерация столбцов в табуляторе js библиотека?

я сделал это, и это работает простохорошо:

    //define data
    var tabledata = {!!$one!!}

    //define table
    var table = new Tabulator("#table-1", {
        data:tabledata,
        autoColumns:true,
        layout:"fitColumns",
    });

, но когда я добавляю "headerVertical: true", он не вносит никаких изменений:

    //define data
    var tabledata = {!!$one!!}

    //define table
    var table = new Tabulator("#table-1", {
        data:tabledata,
        autoColumns:true,
        headerVertical:true,
        layout:"fitColumns",
    });

Может кто-нибудь помочь мне с созданием вертикальных заголовков столбцов, в то время как столбцыгенерировать автоматически?

1 Ответ

1 голос
/ 27 апреля 2019

headerVertical работает только в том случае, если вы определяете столбцы в соответствии с документацией , однако для этого вы можете использовать простой CSS https://jsfiddle.net/dota2pro/t0gw9jbp/5/

чтобы повернуть на 180 градусов используйте CSS поверните

   .tabulator-col-title {
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-top: 20px;
  /* if you use rotate change this to paddig-bottom*/
  transform: rotate(180deg);
  /* incase of rotation*/
}
...