3

したがって、この js フィドルをチェックすると、次のようになります。

http://jsfiddle.net/a9dkU/

ajax 呼び出しの外側から実行すると、チャートがほぼ同時に更新できることがわかります。

ただし、このjsフィドルのようにポイントを更新するためにajax呼び出しを行うと、 http://jsfiddle.net/8JZ35/3/

アニメーションの更新はキューに入れられ、他の更新が完了した後にのみ起動されます。以前にこれに遭遇し、解決策を見つけた人はいますか? 必ずしもすべてを同時に更新する必要はありませんが、別のチャートの再描画が完了する前にチャートの再描画を開始できるようにする必要があります。同時に起動すると2つのチャートが同時に更新できるという奇妙な動作のように思えますが、別々に行うと最初のチャートが終了するまで2番目のチャートの更新を開始できません。

echo ajax呼び出しを行うにはそれが受け入れられ、より良い方法であることに注意し$.toJSON({obj})てください。しかし、それは奇妙なことにエラーをスローしていました。自分を紐付けます。

アップデート

これは、私が話していることをよりよく示すjsfiddleです。エコー API は非常に高速であるため、実際の応答をより適切にシミュレートするために ajax に遅延を追加しました。firefox で表示すると、私が話していることを非常に具体的に見ることができます。

http://jsfiddle.net/M8pkA/2/

4

3 に答える 3

0

現在、この動作は Firefox でのみ発生することが判明しました。同じ URL への複数の ajax リクエストで問題が発生する Firefox まで、問題を追跡しました。これがFirefoxがこれらの状況を処理することを意図したものなのか、それともキャッシュメカニズムであると想定されているのかはわかりません.

基本的に、ここでの答えは、更新がまったく同じ URL を使用しないようにすることです。

したがって、ajax メソッドを使用しているGET場合は、パラメーターによって URL が強制的に異なるものになるため、おそらく問題ありません。使用している場合、POSTまたは同じ URL から異なる応答を取得している場合GETは、ランダムな値を含むパラメーターを追加するだけです。同じ実際の秒の間に2つのリクエストが発生しないことを保証できないため、UNIXエポック時間をミリ秒単位で追加するだけになりました。

実際の回答/例については、このJSFIddleを参照してください

于 2013-06-24T18:46:28.760 に答える
0

ajax()2 番目の呼び出し関数でのみ両方のチャートを redraw() することもできます。

http://jsfiddle.net/8JZ35/5/

http://api.highcharts.com/highstock#Series.addPoint()

于 2013-06-18T14:11:28.913 に答える
0

あなたは次のようなことができます

 var objs=[];//array for addPoint
    function doAjax(obj)
    {
        var series = obj.series[0];

      var x_val = (new Date()).getTime();
      var y_val = Math.random();

      var data = {
          json:"{\"x\": "+x_val+", \"y\": "+y_val+"}"              
        }       

        $.ajax({
            url:"/echo/json/",
            data:data,
            type:"POST"
        })
        .done(function(result){
           console.log(result);

            if(objs.length<$(".charts").length){
                objs.push(function(){series.addPoint([result.x, result.y], true, true)}); 
            }
            if(objs.length==$(".charts").length){//all data loaded 
                $.each(objs,function(i,n){
                    n();//call each addPoint
                });
                objs=[];//clear array
            }



        }); 
    }        

再描画時に setTimeout を変更する

$('#container').highcharts({
        chart: {
            type: 'spline',
            animation: Highcharts.svg, // don't animate in old IE
            marginRight: 10,
            events: {
                load: function() {doAjax(this);},
                redraw:function(){var t=this;setTimeout(function() {doAjax(t);}, 1000);}
            }
        },

http://jsfiddle.net/8JZ35/4/

于 2013-06-17T16:47:57.747 に答える