Question

这是与Basic Javascript loading message while js processing completes

相关的问题

我的主要问题是在我的两个函数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);
}

Answer 1

众所周知，在javascript中执行操作会挂起您的应用程序。这意味着屏幕上仅显示最终输出。因此，当您将光标更改为“等待”并执行到“光标”后，javascript没有更改它，因为ui线程正在忙于计算函数“drawlegend”和“display”中的内容。但是，我认为当您执行“drawlegend”和“显示”异步时，如

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

然后事情应该像你想要的那样。如果这对您有用，请告诉我。

额外信息：在this slideshare（特别是幻灯片5）上解释了您的问题所在。

如何在我想要的时候在d3.js中改变光标？

1 个答案: