Difference between revisions of "Team:Greece/Collaborations"

Line 19: Line 19:
 
   <!-- Vis.js Library -->
 
   <!-- Vis.js Library -->
 
   <script src='https://cdnjs.cloudflare.com/ajax/libs/vis/4.20.1/vis.min.js'></script>
 
   <script src='https://cdnjs.cloudflare.com/ajax/libs/vis/4.20.1/vis.min.js'></script>
 
<!-- Plugin -->
 
<script>
 
(function($) {
 
    $.fn.goTo = function() {
 
        $('html, body').animate({
 
            scrollTop: $(this).offset().top + 'px'
 
        }, 1000);
 
        return this; // for chaining...
 
    }
 
})(jQuery);
 
</script>
 
  
 
     <!-- Call Template Scrips -->
 
     <!-- Call Template Scrips -->
Line 53: Line 41:
 
       });
 
       });
 
     </script>
 
     </script>
 
    <!-- Subsection onHover Functionality -->
 
    <script>
 
function onHoverChanges(idz){
 
$('#'+idz).addClass('opace');
 
}
 
 
function onHoverHide(idz){
 
$('.circlez').removeClass('opace');
 
}
 
    </script>
 
 
  <!-- Display Subsection Functionality -->
 
    <script>
 
    function displayMe(idz){
 
        $('#display_box').css('display', 'block');
 
        var stateMsg;
 
            switch(idz){
 
case 'c_t1': stateMsg = 'Description';
 
break;
 
case 'c_t2': stateMsg = 'Results';
 
break;
 
case 'c_t3': stateMsg = 'Notebook';
 
break;
 
case 'c_t4': stateMsg = 'Safety';
 
break;
 
            }
 
        window.history.replaceState(null, null, stateMsg);
 
        $('.display_frame').removeClass('reveal');
 
        $('#' + stateMsg).addClass('reveal');
 
        $('#ct1').goTo();
 
    }
 
    </script>
 
  
 
</head>
 
</head>
 
<body>
 
<body>
  
 +
<div id="mynetwork"></div>
 +
 +
<script type="text/javascript">
 +
    // create an array with nodes
 +
    var nodes = new vis.DataSet([
 +
        {id: 1, label: 'Node 1'},
 +
        {id: 2, label: 'Node 2'},
 +
        {id: 3, label: 'Node 3'},
 +
        {id: 4, label: 'Node 4'},
 +
        {id: 5, label: 'Node 5'}
 +
    ]);
 +
 +
    // create an array with edges
 +
    var edges = new vis.DataSet([
 +
        {from: 1, to: 3},
 +
        {from: 1, to: 2},
 +
        {from: 2, to: 4},
 +
        {from: 2, to: 5}
 +
    ]);
 +
 +
    // create a network
 +
    var container = document.getElementById('mynetwork');
 +
 +
    // provide the data in the vis format
 +
    var data = {
 +
        nodes: nodes,
 +
        edges: edges
 +
    };
 +
    var options = {};
 +
 +
    // initialize your network!
 +
    var network = new vis.Network(container, data, options);
 +
</script>
 +
 +
<style>
 +
        #mynetwork {
 +
            width: 600px;
 +
            height: 400px;
 +
            border: 1px solid lightgray;
 +
        }
 +
</style>
  
 
<!-- Styling Script -->
 
<!-- Styling Script -->

Revision as of 12:58, 6 September 2017