(timeline) fix top and group axis left to scroll down with touch - Question

[dborchers87]

Hi,

in the example 15 https://github.com/almende/chap-links-library/blob/master/js/src/timeline/examples/example15_mobile.html

i can scroll left and right with my fingers on mobile and touch displays and the left axis with the groups is fixed.

How can i set the top axis with the date and time fixed to to scroll from top to bottom with touch?

Thansk for your help.

[josdejong]

This isn't supported by chap-links-library, but works fine in the successor, vis.js. In the vis.js Timeline you can give the Timeline a fixed or maximum height, and when exceeded, the contents become vertically scrollable.

[dborchers87]

Ok, i tried vis and it works, thanks

But i have another question. I want to view the container with the map in full height and with and when i resize the window there should show no scrollbars, only the touch actions but it doesnt work, ive tried the autoResize option but it doesnt work.

Do you have an idea?

[josdejong]

Giving the Timeline a width and height of 100% should just work.

[dborchers87]

he made the timeline with full width and height but when i resize the whole windows, the timeline wont be resized :(

[josdejong]

do you call timeline.redraw() after resizing? Or you can set autoResize true.

[dborchers87]

i have set autoResize but i dont know where i have to call timeline.redraw()

[dborchers87]

here you find my page: http://dev1.eos-server.com/design/redesign_Nov2015/login_simple.html

and here is the whole code: !DOCTYPE html>

``` ``` ```

• Go to website
• Contact admin
• Options

© 2015. Limitless Web App Kit by Eugene Kopyov

```

[josdejong]

ah sorry, I was confused with the Timeline of the successor of chap-links-library, vis.js, which has an autoResize option. Well, in that case, you have to listen for the window being resized, and if so, redraw the Timeline.

window.addEventListener('resize', function () {
  timeline.checkResize();
});

[dborchers87]

I already use vis.js and have the problem with vis. But thanks. I will try that listener.

Von meinem Samsung Galaxy Smartphone gesendet.

-------- Ursprüngliche Nachricht --------

Von: Jos de Jong notifications@github.com

Datum: 10.02.2016 17:04 (GMT+01:00)

An: almende/chap-links-library chap-links-library@noreply.github.com

Cc: dborchers87 daniel.borchers@live.de

Betreff: Re: chap-links-library fix top and group axis left to scroll down with touch - Question (#359)

ah sorry, I was confused with the Timeline of the successor of chap-links-library, vis.js, which has an autoResize option. Well, in that case, you have to listen for the window being resized, and if so, redraw the Timeline.

window.addEventListener('resize', function () {
  timeline.checkResize();
});

---

Reply to this email directly or view it on GitHub: https://github.com/almende/chap-links-library/issues/359#issuecomment-182447142

[josdejong]

I already use vis.js and have the problem with vis.

ehh, then you should ask your question in the issues section of the vis.js project, not here, this is confusing.

Well, in case of the vis.js Timeline, it has autoResize true by default. All you have to do is give the page, container div, and Timeline itself a height of 100%, something like:

<style>
  body, html, #myTimeline {
    width: 100%;
    height: 100%;
  }
</style>
<script>
  var container = document.getElementById('myTimeline');
  var items = new vis.DataSet([ ... ]);
  var options = {
    width: '100%'
    height: '100%'
  };
  var timeline = new vis.Timeline(container, items, options);
</script>

[dborchers87]

Ok i will wrote a new issue in the vis.js page - sorry for confusing. But i´ve already tried your example but it didn't work

Date: Wed, 10 Feb 2016 23:43:57 -0800 From: notifications@github.com To: chap-links-library@noreply.github.com CC: daniel.borchers@live.de Subject: Re: chap-links-library fix top and group axis left to scroll down with touch - Question (#359)

I already use vis.js and have the problem with vis.

ehh, then you should ask your question in the issues section of the vis.js project, not here, this is confusing.

Well, in case of the vis.js Timeline, it has autoResize true by default. All you have to do is give the page, container div, and Timeline itself a height of 100%, something like:

— Reply to this email directly or view it on GitHub.

[rahulcjain]

I would like to have scroll on the right side and timeline at the top should be fix. How do I achieve this.

When I set minHeight: 300, it appears at the right side but the top row is not fix(freeze) and also the mouse wheel on the board is not working