Question

我刚开始学习编程。我正在尝试创建一个径向仪表，其上有一个固定的输入框，以便框中显示的值将反映在仪表中。

仪表是车辆价值的视觉辅助。此输入框是输入值的位置。如果可能的话，我希望能够为最小值和最大值设置两个输入框。

我正在使用http://justgage.com/。它在预定值时起作用，但这不是我想要的。我看了一些Wijmo代码并尝试合并这两个但没有成功。我提供的代码就是我目前正在处理的代码。对任何愚蠢的代码行道歉，我热切期待回复。

谢谢

 <!doctype html>
<html>
<head>

    <meta charset="utf-8">

    <script src="resources/js/raphael.2.1.0.min.js"></script>
    <script src="resources/js/justgage.1.0.1.min.js"></script>

    <!-- jQuery -->
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>

    <!-- Wijmo CSS and script -->
    <script type="text/javascript" src="http://cdn.wijmo.com/jquery.wijmo-open.all.2.1.0.min.js"></script>
    <script type="text/javascript" src="http://cdn.wijmo.com/jquery.wijmo-complete.all.2.1.0.min.js"></script>

    <!-- KnockoutJS for MVVM-->
    <script type="text/javascript" src="http://cdn.wijmo.com/external/knockout-2.0.0.js"></script>
    <script type="text/javascript" src="http://cdn.wijmo.com/external/knockout.wijmo.js"></script>


<div class="200x160px" id="gauge"></div>



    <script type="text/javascript"> 
    <!--    var viewModel = function () {-->
            var g = new JustGage({
            id: "gauge",
            value: "tip",
            min: 0,
            max: 300,
            title: "Test"
            });
        <!-- Bind ViewModel-->
        $(document).ready(function () {
            var vm = new viewModel();
            ko.applyBindings(vm);
        });
</script> 
</head>


<body>
    <script type="text/javascript">
    var xx = tip;

    </script>

    <div class="container">
        <h2>
            Textbox</h2>
        <input data-bind="value: val" style="width: 200px;" id="xx"/> <span data-bind="text: val"></span>
        <div>

</body>

<html>

Answer 1

您可以参考以下示例实现您的场景，即框中显示的值将反映在仪表中： http://wijmo.com/demo/explore/?widget=Knockout&sample=Overview

使用输入框创建径向仪表

1 个答案: