diff --git a/public/js/client_dbrd.js b/public/js/client_dbrd.js index 5dd02c6..a4e2ab5 100755 --- a/public/js/client_dbrd.js +++ b/public/js/client_dbrd.js @@ -79,16 +79,25 @@ var map = L.map('map', { item5.className = 'ion-md-star'; item5.innerHTML = ' Klaus (AGT)'; + var item2 = document.createElement('div'); + item2.className = 'ion-md-star'; + item2.innerHTML = ' Günter (AGT)'; + var items = new vis.DataSet([ {id: 1, group: 0, className: 'ma', content: 'Hans', start: start, end: end}, - {id: 2, group: 0, className: 'fk', content: 'Günter', start: start2, end: end2}, + {id: 2, group: 0, className: 'fk-agt', content: item2, start: start2, end: end2}, {id: 3, group: 1, className: 'ek', content: 'Rudi', start: start3, end: end3}, {id: 4, group: 1, className: 'ek-agt', content: item5, start: start4, end: end4}, {id: 5, group: 1, className: 'ma', content: 'Jürgen', start: start5, end: end5}, {id: 6, group: 1, className: 'ek', content: 'Florian', start: start6, end: end6}, ]); // Configuration for the Timeline - var options = {}; + var options = { + rollingMode: { + follow: true, + offset: 0.25 + } + }; // Create a Timeline var timeline = new vis.Timeline(container, items, options); timeline.setGroups(groups); @@ -118,3 +127,4 @@ var map = L.map('map', { id2 ); timeline.setCustomTimeMarker(markerText, id2, false); + diff --git a/views/includes/master_dashboard.pug b/views/includes/master_dashboard.pug index 9c71b48..aa6fe6c 100755 --- a/views/includes/master_dashboard.pug +++ b/views/includes/master_dashboard.pug @@ -8,27 +8,30 @@ style(type='text/css'). } .vis-item.ek { background-color: lightblue; - border-color: blue; + border-color: black; } .vis-item.ma { - background-color: red; - border-color: darkred; + background-color: lightpink; + border-color: black; } .vis-item.fk { - background-color: green; - border-color: darkgreen; + background-color: lightgrey; + border-color: black; } .vis-item.ek-agt { background-color: lightblue; - border-color: gold; + border-color: orangered; + border-width: 2px; } .vis-item.ma-agt { - background-color: red; - border-color: yellow; + background-color: lightpink; + border-color: orangered; + border-width: 2px; } .vis-item.fk-agt { - background-color: green; - border-color: yellow; + background-color: lightgrey; + border-color: orangered; + border-width: 2px; }