1

我正在尝试使用下面的代码实现仪表控制，但没有得到任何输出，尽管当我在 html 文件中尝试相同时，我得到了 3 个仪表的输出。

我改为$(document).ready()而不是window.onload链接window.onload Not Working correclty中提到的。但这没有帮助。

我是 Javascripts 或 JQuery 的初学者。请让我知道如何实现这一目标。

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">
      body {
        text-align: center;
      }

      #g1, #g2, #g3 {
        width:200px; height:160px;
        display: inline-block;
        margin: 1em;
      }

      p {
        display: block;
        width: 450px;
        margin: 2em auto;
        text-align: left;
      }
    </style>
   <script src="raphael.2.1.0.min.js" type="text/javascript"></script>
    <script src="justgage.1.0.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        var g1, g2, g3;

        window.onload = function () {
            var g1 = new JustGage({
                id: "g1",
                value: getRandomInt(350, 980),
                min: 350,
                max: 980,
                title: "Lone Ranger",
                label: "miles traveled"
            });

            var g2 = new JustGage({
                id: "g2",
                value: 32,
                min: 50,
                max: 100,
                title: "Empty Tank",
                label: ""
            });

            var g3 = new JustGage({
                id: "g3",
                value: 120,
                min: 50,
                max: 100,
                title: "Meltdown",
                label: ""
            });

            setInterval(function () {
                g1.refresh(getRandomInt(350, 980));
                g2.refresh(getRandomInt(0, 49));
                g3.refresh(getRandomInt(101, 200));
            }, 2500);
        };
    </script>

    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <div id="g1"></div>
    <div id="g2"></div>
    <div id="g3"></div>
    </div>
    </form>
</body>
</html>
4

1 回答 1

0

您可以尝试 jqChart 的仪表 - http://www.jqchart.com/jquery/gauges

他们有很多例子和丰富的功能。

免责声明：我为 jqChart 工作。

最佳，马克西姆·米列夫

于 2014-01-11T08:47:35.573 回答