VisJS 随机图

VisJS 随机图

大家好,又见面了,我是全栈君。

VisJS 随机图

<!doctype html>
<html>
<head>
    <title>Random nodes</title>
    
    <style type="text/css">
        body {
            font: 13pt "courier new";
        }
        #mynetwork {
            width: 600px;
            height: 600px;
            border: 8px solid blueviolet;
        }
    </style>
    
    <script type="text/javascript" src="VisJS/dist/vis.js"></script>
    
    <script type="text/javascript">
        function draw(){
            var nodes = [];
            var edges = [];
            var countConnected = [];
            var nodeCount = document.getElementById( "nodeCount" ).value;
            for( var i = 0; i < nodeCount; ++i ){
                nodes.push( { id: i, label: String( i ) } );
                countConnected[i] = 0;
                if( i == 1 ){
                    edges.push( { from: i, to: 0 } );
                    countConnected[i]++;
                    countConnected[0]++;
                }
                else if( i > 1 ){
                    var rand = Math.floor( Math.random() * edges.length * 2 );
                    var limit = countConnected.length;
                    var val = 0;
                    var j = 0;
                    while( val < rand && j < limit ){
                        val += countConnected[j];
                        j++;
                    }
                    edges.push( { from: i, to: j } );
                    countConnected[i]++;
                    countConnected[j]++;
                }
            }
            var container = document.getElementById( "mynetwork" );
            var data = { nodes: nodes, edges: edges };
            var options = { edges: {}, stabilize: false };
            var net = new vis.Network( container, data, options );
        }
    </script>
</head>

<body onload="draw();">
    <form onsubmit="draw(); return false;">
        <label for="nodeCount">Number of nodes:</label>
        <input id="nodeCount" type="text" value="10" style="width: 50px;">
        <input type="submit" value="Go">
    </form>

    <br>

    <div id="mynetwork"></div>
</body>
</html>

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/115529.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • rabbitmqkafka对比_全场景

    rabbitmqkafka对比_全场景这是陈东景于2021年8月29日下午16点原创作品,转载请标明出处!!!!在进行软件设计的过程中,如果软件设计业务上存在需要短时间内处理大批量的信息,又需要能保证软件能正常运行(保证软件的高可靠和高可用)。因为大批量(几十万,几百万级别的数据或者消息需要同一个时间处理),软件的IO过高,会导致软件运行阻塞或者消耗内存过高而崩溃,甚至是宕机。消息队列的概念被提了出来,通过缓存消息的模式,进行生产和消费。通过异步处理的方式,解耦这种短时间内出现大批量需要处理消息的场景。目前我们使用到的比…

    2022年10月14日
    3
  • insertBefore()

    insertBefore()insertBefore()方法将把一个给定的节点插入到一个给定元素节点的给定子节点前面,他返回一个指向新增子节点的引用指针:如上所示,节点newNode将被插入元素节点element并出现在节点t

    2022年8月2日
    5
  • 可视化希尔排序算法是什么_希尔排序一趟排序的结果

    可视化希尔排序算法是什么_希尔排序一趟排序的结果如需转载请标明出处:https://blog.csdn.net/zhuzi9QQ技术交流群:594200841前言概念介绍希尔排序是基于插入排序算法的一种更高效的改进版本。它是把记录按下标的一定增量分组,对每组使用直接插入排序算法排序;随着增量逐渐减少,每组包含的关键词越来越少,当增量减少至1时,整个文件恰被分成一组。此时算法便终止。原理讲解以[41243421917]这个序列为例说明希尔排序算法的实现原理未开始遍历时,此时效果如下图由上面数组可知

    2022年10月2日
    2
  • nactive激活码_在线激活

    (nactive激活码)本文适用于JetBrains家族所有ide,包括IntelliJidea,phpstorm,webstorm,pycharm,datagrip等。IntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,下面是详细链接哦~https://javaforall.net/ide…

    2022年3月27日
    67
  • 微服务架构—服务降级

    微服务架构—服务降级1、简介什么是服务降级?当服务器压力剧增的情况下,根据实际业务情况及流量,对一些服务和页面有策略的不处理或换种简单的方式处理,从而释放服务器资源以保证核心交易正常运作或…

    2022年6月11日
    46
  • Android入门基础教程(小白速成1)

    Android入门基础教程(小白速成1)Android入门基础教程(小白速成1)编译工具:AndroidStudio各种工具其实大同小异开发环境的搭建还有项目新建这里就不过多说明了,网上有很多教程。项目新建按照需求来就好,我这里选用空的界面(EmptyActivity)和Android4.0.3,大家一定要注意安卓版本匹配问题鸭,之前每次新建项目都报错,最后才发现是版本匹配问题。话不多说,进入正题吧!HelloWorld!新建好项目以后,我们首先认识几个主要用到的界面。MainActivity.java页面,这个页面相当

    2022年5月4日
    80

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号