项目实训第三周(2)

在导入完成所有的js脚本后,我们就可以使用sigma.js插件的相关功能了,首先我们要定义一个显示的区域

<div id="container">
  <style>
      *{
          border: none;
          margin: 0;
      }
      .top{
    position: fixed;
    top: 0;
    height: 54px;
    width: 100%;
    background-color: rgb(155,13,20);
    padding: 10px 30px;
}
.headPic{
    float: left;
    width: 50px;
    height: 50px;
    border: 2px solid #e5e5e5;
    border-radius: 50%;
    /*background: url(未标题-1.png) no-repeat 0 0;*/
    /*background-size: cover;*/
    /*margin: 10px 10px;*/
    }
    .headPic #h-avatar{
        width: 100%;
        border-radius: 50%;
    }
    .top #ID{
        float: left;
        color: #fff;
        margin-left: 30px;
        font-family: "Microsoft YaHei UI Light";
    }

    #graph-container {
        margin-top: 74px;
        width: 100%;
        height: 680px;
        background-color: #e5e5e5;
    }
    .sigma-edge {
      stroke: #de360f;
	  stroke-width: 0.7px;
    }
    .sigma-node {
      stroke: #9eadbf;
      stroke-width: 0px;
    }
    .sigma-node:hover {
      fill: #ff0000;
    }
    .muted {
      fill-opacity: 0.1;
      stroke-opacity: 0.1;
    }
</div>

上一篇:jointsjs 使用时,报LinkView: invalid source cell.,原因及解决方式


下一篇:鼠标悬浮时圆环顺时针填满的动画实现