Library Management System-Grade Management System

library management system

performance management system

  Following the last menu interface, we completed the data visualization interface on the right, including stacked area charts, pie charts, bar charts and progress bars. Of course, if you want something cool in this place, you can choose a river map or a knowledge map to do it. The following is the final interface display: the left side is the menu of the   library
  management system, the right side is the data visualization page, and the

next is the refinement
  of the graph.

picture

program directly

code:

<header class="header left">
  <div class="left nav">
      <ul>
          </ul>
  </div>
    <div class="header_center left" style="position:relative">
        
        <h2><strong>图书大数据分析展示</strong></h2>

    </div>
    <div class="text_right">
        <ul>

        </ul>
    </div>

</header>
<div class="con left">
  <!--数据总概-->
  <div class="con_div">
      <div class="jaslkj">
          <div class="left">
              <img src="a.png" class="qtuwy"/>
              <div class="klaj">
                  <p>全年借书总量(万本)</p>
                  <p>53</p>
              </div>
          </div>
          <div class="right">
              <img src="j.png" class="left text01_img"/>
              <div class="jljlj">
                  <p>当月借书总理(万本)</p>
                  <p>7</p>
              </div>
          </div>
      </div>
      <div class="con_div_text left">
          <div class="con_div_text01 left">
              <img src="l.png" class="kajsk"/>
              <div class="hakjh">
                  <p>借书人数(人)</p>
                  <p class="sky">12356</p>
              </div>
          </div>
          <div class="con_div_text01 right">
              <img src="sd.png" class="sl"/>
              <div class="left text01_div">
                  <p>当月借书人数(人)</p>
                  <p class="sky">1235</p>
              </div>
          </div>
      </div>
      <div class="t">

          <div class="qwe">
              <img src="../images/info_11.png" class="left text01_img"/>
              <div class="xm">
                  <p>学生占比</p>
                  <p class="org">92%</p>
              </div>
          </div>
          <div class="co">
              <img src="i.png" class="x"/>
              <div class="ft">
                  <p>教师占比</p>
                  <p class="org">8%</p>
              </div>
          </div>
      </div>
  </div>
    <!--统计分析图-->
    <div class="div_any">
        <div class="asd">
            <div class="hi">
                <div class="e"><img src="fg.png">各年级学生借书数量占比</div>
                <p id="gr" class="ar"></p>
            </div>
            <div class="div_any_child">
                <div class="div_any_title"><img src="../images/title_6.png">各学院学生借书数量占比</div>
                <p id="histogramChart2" class="p_chart"></p>
            </div>
        </div>
        <div class="left div_any01">
            <div class="div_any_child">
                <div class="div_any_title"><img src="../images/title_7.png">各年级学生借书人次(人)</div>
                <p id="lineChart1" class="p_chart"></p>
            </div>
            <div class="div_any_child">
                <div class="div_any_title"><img src="../images/title_8.png">各专业学生借书人次(人)</div>
                <p id="lineChart2" class="p_chart"></p>
            </div>
        </div>
        <div class="left div_any01">
            <div class="div_any_child">
                <div class="div_any_title"><img src="../images/title_9.png">上周各年级学生借书人次占比(%)</div>
                <p id="histogramChart3" class="p_chart"></p>
            </div>
            <div class="div_any_child">
                <div class="div_any_title"><img src="../images/title_10.png">平均每天借书数目(本)</div>
                <p id="histogramChart4" class="p_chart"></p>
            </div>
        </div>
        <div class="left div_any01">
            <div class="div_any_child">
                <div class="div_any_title"><img src="../images/title_11.png">每天借书时间段</div>
                <p id="pieChart1" class="p_chart"></p>
            </div>
            <div class="div_any_child">
                <div class="div_any_title"><img src="../images/title_12.png">每周借书时间段</div>
                <p id="pieChart2" class="p_chart"></p>
            </div>
        </div>
    </div>

All programs

print:("q917267119")