diff options
Diffstat (limited to 'www/lib/vis/examples/timeline/other/functionLabelFormats.html')
| -rw-r--r-- | www/lib/vis/examples/timeline/other/functionLabelFormats.html | 141 |
1 files changed, 0 insertions, 141 deletions
diff --git a/www/lib/vis/examples/timeline/other/functionLabelFormats.html b/www/lib/vis/examples/timeline/other/functionLabelFormats.html deleted file mode 100644 index 9de9023b..00000000 --- a/www/lib/vis/examples/timeline/other/functionLabelFormats.html +++ /dev/null @@ -1,141 +0,0 @@ -<!DOCTYPE HTML> -<html> -<head> - <title>Timeline | Custom function label format example</title> - - <style> - body, html { - font-family: arial, sans-serif; - font-size: 11pt; - } - - #visualization { - box-sizing: border-box; - width: 100%; - height: 300px; - } - </style> - - <!-- note: moment.js must be loaded before vis.js, else vis.js uses its embedded version of moment.js --> - <script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js"></script> - - <script src="../../../dist/vis.js"></script> - <link href="../../../dist/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" /> - <script src="../../googleAnalytics.js"></script> -</head> -<body> -<p> - This example demonstrate using custom function label formats. -</p> -<div id="visualization"></div> - -<script> - var now = moment().minutes(0).seconds(0).milliseconds(0); - var groupCount = 3; - var itemCount = 20; - - // create a data set with groups - var names = ['John', 'Alston', 'Lee', 'Grant']; - var groups = new vis.DataSet(); - for (var g = 0; g < groupCount; g++) { - groups.add({id: g, content: names[g]}); - } - - // create a dataset with items - var items = new vis.DataSet(); - for (var i = 0; i < itemCount; i++) { - var start = now.clone().add(Math.random() * 200, 'hours'); - var group = Math.floor(Math.random() * groupCount); - items.add({ - id: i, - group: group, - content: 'item ' + i + - ' <span style="color:#97B0F8;">(' + names[group] + ')</span>', - start: start, - type: 'box' - }); - } - - // create visualization - var container = document.getElementById('visualization'); - var options = { - format: { - minorLabels: function(date, scale, step) { - var now = new Date(); - var ago = now - date; - var divider; - switch (scale) { - case 'millisecond': - divider = 1; - break; - case 'second': - divider = 1000; - break; - case 'minute': - divider = 1000 * 60; - break; - case 'hour': - divider = 1000 * 60 * 60; - break; - case 'day': - divider = 1000 * 60 * 60 * 24; - break; - case 'weekday': - divider = 1000 * 60 * 60 * 24 * 7; - break; - case 'month': - divider = 1000 * 60 * 60 * 24 * 30; - break; - case 'year': - divider = 1000 * 60 * 60 * 24 * 365; - break; - default: - return new Date(date); - } - return (Math.round(ago * step / divider)) + " " + scale + "s ago" - }, - majorLabels: function(date, scale, step) { - var now = new Date(); - var ago = now - date; - var divider; - switch (scale) { - case 'millisecond': - divider = 1; - break; - case 'second': - divider = 1000; - break; - case 'minute': - divider = 1000 * 60; - break; - case 'hour': - divider = 1000 * 60 * 60; - break; - case 'day': - divider = 1000 * 60 * 60 * 24; - break; - case 'weekday': - divider = 1000 * 60 * 60 * 24 * 7; - break; - case 'month': - divider = 1000 * 60 * 60 * 24 * 30; - break; - case 'year': - divider = 1000 * 60 * 60 * 24 * 365; - break; - default: - return new Date(date); - } - return (Math.round(ago * step / divider)) + " " + scale + "s ago" - } - } - }; - - var timeline = new vis.Timeline(container); - timeline.setOptions(options); - timeline.setGroups(groups); - timeline.setItems(items); - -</script> -</body> -</html>
\ No newline at end of file |