Setting rootpanel border to none stops updating #53

MojoDK · 2014-03-06T13:33:52Z

Phew .. this was a hard one to track down.

Setting the rootpanel border to none in css inside the BODY TAGS, stops the timeline from updating. If you place it inside the HEAD tags it works.

So this DOESN'T work...

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />
    <title>Timeline | Basic demo</title>
    <style type="text/css">
        body, html {
            font-family: sans-serif;
        }
    </style>
    <script type="text/javascript" src="/_base/assets/plugins/vis/dist/vis.js"></script>
    <link href="/_base/assets/plugins/vis/dist/vis.min.css" rel="stylesheet" />
</head>
<body>
    <style type="text/css">
        .vis.timeline.rootpanel {
            border: none;
        }
    </style>

    <div id="visualization"></div>
    <script type="text/javascript">
        var container = document.getElementById('visualization');
        var items = [
    { id: 1, content: 'item 1', start: '2013-04-20' },
    { id: 2, content: 'item 2', start: '2013-04-14' },
    { id: 3, content: 'item 3', start: '2013-04-18' },
    { id: 4, content: 'item 4', start: '2013-04-16', end: '2013-04-19' },
    { id: 5, content: 'item 5', start: '2013-04-25' },
    { id: 6, content: 'item 6', start: '2013-04-27' }
        ];
        var options = {};
        var timeline = new vis.Timeline(container, items, options);
    </script>
</body>
</html>

This DOES work...

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />
    <title>Timeline | Basic demo</title>
    <style type="text/css">
        body, html {
            font-family: sans-serif;
        }

        .vis.timeline.rootpanel {
            border: none;
        }
    </style>
    <script type="text/javascript" src="/_base/assets/plugins/vis/dist/vis.js"></script>
    <link href="/_base/assets/plugins/vis/dist/vis.min.css" rel="stylesheet" />
</head>
<body>
    <div id="visualization"></div>
    <script type="text/javascript">
        var container = document.getElementById('visualization');
        var items = [
    { id: 1, content: 'item 1', start: '2013-04-20' },
    { id: 2, content: 'item 2', start: '2013-04-14' },
    { id: 3, content: 'item 3', start: '2013-04-18' },
    { id: 4, content: 'item 4', start: '2013-04-16', end: '2013-04-19' },
    { id: 5, content: 'item 5', start: '2013-04-25' },
    { id: 6, content: 'item 6', start: '2013-04-27' }
        ];
        var options = {};
        var timeline = new vis.Timeline(container, items, options);
    </script>
</body>
</html>

Since I'm using the timeline in partial vies in MVC, I would prefer being able to set the rootpanel border inside the body tags.

Don't know if there's a better way to remove the border?

:)

josdejong · 2014-03-06T14:26:21Z

That's interesting... will have a look at it

josdejong · 2014-05-02T12:42:29Z

This should be fixed now in v1.0.0

MojoDK mentioned this issue Mar 6, 2014

Is it possible to "redraw" the timeline? #50

Closed

AlexDM0 added the Timeline label Mar 6, 2014

josdejong closed this as completed May 2, 2014

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Setting rootpanel border to none stops updating #53

Setting rootpanel border to none stops updating #53

MojoDK commented Mar 6, 2014

josdejong commented Mar 6, 2014

josdejong commented May 2, 2014

Setting rootpanel border to none stops updating #53

Setting rootpanel border to none stops updating #53

Comments

MojoDK commented Mar 6, 2014

josdejong commented Mar 6, 2014

josdejong commented May 2, 2014