Question

我需要帮助我是JS，JQuery初学者，我必须为大学做一个项目。我必须创建一个Highchart应用程序，它在文本框中输入一个整数并按下按钮后会发生变化。而x-Achse必须是实际时间。我尝试了一些东西但没有任何作用。我真的需要一些帮助和提示。

由于

main.js

 $(function(){


    "use strict";

    var content = $('#content');
    var input = $('#input');
    var status = $('#status');
    var numb = false;
    var number = null;
    var logged = false;
    var socket = $.atmosphere;
    var request = { url: document.location.toString() + 'chat',
            contentType : "application/json",
            logLevel : 'debug',
            transport : 'sse',
            fallbackTransport: 'long-polling'};

    request.onOpen = function(response){

        input.removeAttr('disabled').focus(); 
        status.text('Write number (only integer):');
    };

    request.onMessage = function (response){
        var message = response.responseBody;
        try{
            var json = jQuery.parseJSON(message);
        } catch (e){
            console.log('This doesn\'t look like a valid JSON:', message.data);
            return;
        }

        input.removeAttr('disabled').focus();

        addMessage(json.number);


    };

    request.onClose = function(response) {
        logged = false;
    };

    request.onError = function(response) {
        content.html($('<p>', { text: 'Sorry, but there\'s some problem with your '
            + 'socket or the server is down' }));
    };

    var subSocket = socket.subscribe(request);

    input.keydown(function(e){
        if (e.keyCode === 13){ //code fuer enter taste
            var msg = $(this).val();



            subSocket.push(jQuery.stringifyJSON({ number: msg }));
            $(this).val('');
             input.attr('disabled', 'disabled');
                if (numb === false) {
                    numb = msg;
                }


        }
    });

     function addMessage(message) {
             $('#Integerplot > tbody:last').append('<tr><td>'+message+'</td></tr>'); 


        }
    });

的index.html

<!DOCTYPE html>



<html>

<head>
<script type="text/javascript" src="jquery/jquery-1.9.0.js"></script>
<script type="text/javascript" src="jquery/jquery.atmosphere.js"></script>
<script type="text/javascript" src="jquery/main.js"></script>

    <meta charset="utf-8">
    <title>Application</title>


</head>
<body>
<div id="header"><h4 style="height: 35px; width: 502px">Temperature</h4></div>
<div id="content"></div>

<div id="container" style="height: 400px"></div>
<button id="button">Add point</button>

<div>
    <span id="status">Please wait...</span>
    <input type="text" id="input" disabled="disabled"/>
</div>
<table id="Integerplot" > 
<thead> 
<tr> 
    <th >Number1</th> 
    <th>Number 2</th> 
</tr> 
</thead> 
<tbody> 
<tr> 
    <td id="number1"></td> 
    <td id="number2"></td> 

</tr> 

</tbody> 
</table> 
 <script type="text/javascript">
 $(function () {
        $('#container').highcharts({
            series: [{
                data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
            }]
        });


        // the button action
        $('#button').click(function() {
            var chart = $('#container').highcharts();
            chart.series[0].addPoint(Math.random() * 100, true, true);
        });
    });
     </script>

<script src="highcharts/js/highcharts.js"></script>
<script src="highcharts/js/modules/exporting.js"></script>


</body>
</html>

从文本框输入整数的动态Highcharts？

0 个答案: