Ticket/InsdepUI/plugin/justgage-1.2.2/examples/custom-sectors.html

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

<!doctype html>
<html>

<head>
  <meta charset="utf-8"/>
  <title>Custom Sectors</title>
  <meta name="viewport" content="width=device-width">

  <style>
  .container {
    width: 450px;
    margin: 0 auto;
    text-align: center;
  }

  .gauge {
    width: 450px;
    height: 450px;
  }

  a:link.button,
  a:active.button,
  a:visited.button,
  a:hover.button {
    margin: 30px 5px 0 2px;
    padding: 7px 13px;
  }

  </style>

</head>


<body>

  <div class="container">
    <div id="gg1" class="gauge"></div>
    <p id="gg1_text">0-50 is green, 51-100 is red</p>
    <a href="#" id="gg1_refresh" class="button grey">Random Refresh</a>
    <a href="#" id="gg1_update" class="button grey">Update Sectors</a>
  </div>

  <script src="../raphael-2.1.4.min.js"></script>
  <script src="../justgage.js"></script>
  <script>
  document.addEventListener("DOMContentLoaded", function(event) {
    var gg1 = new JustGage({
      id: "gg1",
      value : 72.15,
      min: 0,
      max: 100,
      decimals: 2,
      gaugeWidthScale: 0.6,
      customSectors: [{
        color : "#00ff00",
        lo : 0,
        hi : 50
      },{
        color : "#ff0000",
        lo : 50,