聚焦+基于上下文的缩放，用于同一页面中的多个图形

Focus+context based zoom for multiple graphs in the same page

本文关键字：一页 图形 上下文 聚焦 缩放 用于      更新时间：2023-09-26

我的网页中有'n'个图（单个）。现在我需要添加一个公共条，它负责一次缩放所有图形，并且任何图形上的onclick（）事件都会导致一条垂直线切割所有图形。。！！！

我不知道如何做这些事情，所以我这边没有代码。很抱歉。但是，是的，图形部分已经涵盖，我可以根据用户选择显示所有图形。

请帮我解决这两个要求或任何链接或指针也将不胜感激。

我相信你看到这个例子了吧？在brushed回调中：

function brushed() {
  x.domain(brush.empty() ? x2.domain() : brush.extent());
  focus.select(".area").attr("d", area);
  focus.select(".x.axis").call(xAxis);
}

它设置了一个x域，将其应用于绘图的轴，并重新绘制绘图的面积图。

只需扩展这个：

function brushed() {
  // shared x domain of plots, update extent
  x.domain(brush.empty() ? x2.domain() : brush.extent());
  // adjust plot 1
  plot1.select(".area").attr("d", area);
  plot1.select(".x.axis").call(xAxis);
  // adjust plot 2
  plot2.select(".line").attr("d", line);
  plot2.select(".x.axis").call(xAxis);
  // etc...
}
相关文章：