0 
**This is First HTML Page and in this file I want to import callback functions. I have provided the link of that page below:**
<html>
<head>
  <title>vis js | Timeline | A lot of grouped data</title>

  <!-- vis js css link -->
  <link
      href="https://unpkg.com/vis-timeline@latest/styles/vis-timeline-graph2d.min.css"
      rel="stylesheet"
      type="text/css"
    />
  <!-- moment js unpkg link -->
    <script
      type="text/javascript"
      src="https://unpkg.com/moment@latest"
    ></script>

  <!-- vis js Data Set unpkg link -->
    <script
      type="text/javascript"
      src="https://raw.githubusercontent.com/almende/vis/master/lib/DataSet.js"
    ></script>
  <!-- vis js Timeline unpkg link -->
    <script
      type="text/javascript"
      src="https://unpkg.com/vis-timeline@latest/standalone/umd/vis-timeline-graph2d.min.js"
    ></script>

  <style type="text/css">
    body {
      color: #4D4D4D;
      font: 10pt arial;
    }
  </style>
  
</head>

<body onresize="/*timeline.checkResize();*/">
<h1>Timeline grouping performance</h1>

<p>
  Choose a number of items:
  <a href="?count=100">100</a>,
  <a href="?count=1000">1000</a>,
  <a href="?count=10000">10000</a>,
  <a href="?count=100000">100000</a>
<p>
<p>
  Current number of items: <span id='count'>100</span>
</p>

<div id="visualization"></div>

<script>
  function gup( name ) {
    name = name.replace(/[\[]/,"\\[").replace(/[\]]/,"\\]");
    var regexS = "[\\?&]"+name+"=([^&#]*)";
    var regex = new RegExp( regexS );
    var results = regex.exec( window.location.href );
    if( results == null )
      return "";
    else
      return results[1];
  }

  // get selected item count from url parameter
  var count = (Number(gup('count')) || 1000);

  // create groups
  var groups = new vis.DataSet([
    {id: 1, content: 'Truck&nbsp;1'},
    {id: 2, content: 'Truck&nbsp;2'},
    {id: 3, content: 'Truck&nbsp;3'},
    {id: 4, content: 'Truck&nbsp;4'}
  ]);

  // create items
  var items = new vis.DataSet();

  var order = 1;
  var truck = 1;
  for (var j = 0; j < 4; j++) {
    var date = new Date();
    for (var i = 0; i < count/4; i++) {
      date.setHours(date.getHours() +  4 * (Math.random() < 0.2));
      var start = new Date(date);

      date.setHours(date.getHours() + 2 + Math.floor(Math.random()*4));
      var end = new Date(date);
     
     **I also want to Add Items Manually using a Button, this code below adds Item randomly**
      items.add({
        id: order,
        group: truck,
        start: start,
        end: end,
        content: 'Order ' + order
      });

      order++;
    }
    truck++;
  }

  // specify options
  var options = {
    stack: false,
    start: new Date(),
    end: new Date(1000*60*60*24 + (new Date()).valueOf()),
    editable: true,
    margin: {
      item: 10, // minimal margin between items
      axis: 5   // minimal margin between items and the axis
    },
    orientation: 'top'
  };

  // create a Timeline
  var container = document.getElementById('visualization');
  timeline = new vis.Timeline(container, null, options);
  timeline.setGroups(groups);
  timeline.setItems(items);

  document.getElementById('count').innerHTML = count;
</script>

</body>
</html>

这是您可以在线找到 的第二个 HTML 页面链接。https://visjs.github.io/vis-timeline/examples/timeline/editing/editingItemsCallbacks.html 查看回调函数理解，然后到本页Page Source获取代码。

我想将此链接页面的回调函数和相关功能添加到我的主文件First HTML Page中！我想在第一个 HTML 页面中添加的第二个 HTML 页面的这些功能是回调函数，例如：

  • 添加
  • 移动
  • 移动
  • 更新 &,
  • 删除

在链接中，您还将看到当我们操作项目时输出正在打印在屏幕上。也请帮我解决它！我不希望输出打印在屏幕上

4

0 回答 0