0

これが私のデモのリンクです！よくわからない場合は、fisheye demo2 のこのリンクを参照してください。

fisheye.copy = function() {
  return d3_fisheye_scale(scale.copy(), d, a);
};

fisheye.nice = scale.nice;
fisheye.ticks = scale.ticks;
fisheye.tickFormat = scale.tickFormat;
return d3.rebind(fisheye, scale, "domain", "range");

魚眼をスムーズに動かしたいのですが、つまり、平らな空間を通過すると、魚眼も動きます。

4

1 に答える 1

0

カップルの問題:

1.) tsv ファイルの最後にいくつかの空白行があります。これは、偽のデータをプロットに導入しています。

2.) 要素で円をラップしましたg。グループは「空のg」コンテナであり、マウス イベントを受け取りません。ここでの1つのトリックは、空のスペースをrect.

var svg = d3.select("body").append("svg")
  .attr("width", width + margin.left + margin.right)
  .attr("height", height + margin.top + margin.bottom)
  .append("g")
  .attr("transform", "translate(" + margin.left + "," + margin.top + ")");

svg.append("rect")
  .attr('fill','none')
  .attr('pointer-events', 'all')
  .attr("width", width + margin.left + margin.right)
  .attr("height", height + margin.top + margin.bottom)
  .attr("class","chartArea");

次に、マウスオーバーは次のようになります。

d3.select(".chartArea").on("mousemove", function() {
  fisheye.focus(d3.mouse(this));
  ...

例を更新しました。

于 2014-11-28T18:20:41.883 に答える