0

これは、 js の処理が完了している間の基本的な Javascript の読み込みメッセージに関する質問です。

私の主な問題は、2 つの関数 drawlegend() と display() が呼び出される前にカーソルが変更されず、すべてが終了した後に変更されることです。カーソルの復元が一時的にコメントアウトされた以下のコードを使用すると、砂時計が表示されますが、すべてが終了した後です。

遅い関数が呼び出される前に、カーソルを砂時計に変更するにはどうすればよいですか?

examplefunc()
{
   mini.append("text")
    .text(series[i].name)
    .attr("x",30)
    .attr("y",(15+(15*i)))
    .attr("stroke",(d3.rgb(192,192,192)))
    .attr("fill",(d3.rgb(192,192,192)))
    .attr("stroke-width",0)
    .style("font-size","12px")
    .attr("text-anchor","start")
    .attr("id","legend")
    .on('mouseup', legendclick);
}

//===== legend clicked
function legendclick()
{
   //--- get mouse pos
   var origin = d3.mouse(this);

   //---  get channel
   var ch=Math.floor((origin[1]-4)/15);

   //--- toggle active state
   if (series[ch].active==true)
      series[ch].active=false;
   else
      series[ch].active=true;

   setTimeout(setcursor("wait"),5);         
   drawlegend();
   display();
   //setTimeout(setcursor("default"),5); // temp removed to see any result at all
 }

//===== set cursor
function setcursor(cursor)
{
  d3.select("body").style("cursor", cursor);
}
4

1 に答える 1

4

JavaScript で何かを実行すると、アプリケーションがハングすることが知られています。これは、最終的な出力のみが画面に表示されることを意味します。したがって、カーソルを「wait」に変更し、実行後に「cursor」に変更しても、UI スレッドが関数「drawlegend」と「display」の計算でビジーだったため、JavaScript はカーソルを変更しませんでした。ただ、「drawlegend」と「display」を非同期で実行するとこんな感じになると思います

setTimeout(function () {
        drawLegend();
        display();
        setcursor("default");
}, 0);

その後、物事はあなたが望むように進むはずです。これがうまくいくかどうか教えてください。

追加情報:このスライドシェア(特にスライド 5) では、問題が何であるかが説明されています。

于 2013-08-16T06:14:00.640 に答える