Одинаковая высота для всех элементов в группе на временной шкале с помощью vis.js - PullRequest
Новая
       27

Одинаковая высота для всех элементов в группе на временной шкале с помощью vis.js

0 голосов
/ 04 декабря 2018

Я использую vis.js для отображения временной шкалы со смежными неотложенными элементами.

Некоторые элементы имеют содержимое более длинное, чем другие, и мне бы хотелось, чтобы все элементы в одной группе имели одинаковую высоту.

Содержимое является динамическим, поэтому я не могу указать фиксированную минимальную или максимальную высоту в параметрах. 

var groups = new vis.DataSet([{id: 'first', content: 'group 1'}, {id: 'second', content: 'group 2'}]);

var items = new vis.DataSet({});
items.add([
        {id: 0, content: 'item 0', start: '2014-01-23T12:00:00', end: '2014-01-26T12:00:00',group:'first'},
        {id: 1, content: 'item 1 <br />long title', start: '2014-01-26T12:00:00', end: '2014-01-29T12:00:00',group:'first'},
        {id: 2, content: 'item 2', start: '2014-01-29T12:00:00', end: '2014-01-31T12:00:00',group:'first'},

        {id: 3, content: 'item 3<br/>Very long<br/>description', start: '2014-01-20T12:00:01', end: '2014-01-24T12:00:00',group:'second'},
        {id: 4, content: 'item 4', start: '2014-01-24T12:00:00', end: '2014-01-26T12:00:00',group:'second'},
        {id: 5, content: 'item 5<br/>Description', start: '2014-01-26T12:00:00', end: '2014-01-29T12:00:00', type: 'range', group:'second'},
        {id: 6, content: 'item 6<br/>Description', start: '2014-01-29T12:00:00', end: '2014-01-31T12:00:00', type: 'background', style:'background-color: yellow', group:'second'},

]);

var container = document.getElementById('visualization');

https://jsfiddle.net/jschmitz/13suvyp8/12/

Тип 'background' близокк тому, что я хочу, но на элемент больше нельзя нажимать.

Я пытался настроить свойства CSS, но свойство top элемента вычисляется динамически, и я не нашел правила, которое обрабатывает все.

1 Ответ

0 голосов
/ 21 февраля 2019

Я думаю, style атрибут - это то, что вы ищете.Вы можете использовать атрибут style опций элемента для определения стилей CSS для отдельных элементов.

items = [{id: 4, content: 'item 4', start: '2014-01-24T12:00:00', end: '2014-01-26T12:00:00',group:'second', style:'height:100px'},]

Рабочую демонстрацию можно найти здесь .

...