Question

创作页面https://rstudio.github.io/crosstalk/authoring.html表示在返回sel_handle和renderValue之前在工厂范围内创建resize。这是必要的（例如，因为它需要在调用renderValue之前创建），还是可以在renderValue()中创建，并附加到scatter？我指的是该页面的示例代码，即

HTMLWidgets.widget({

  name: 'd3scatter',

  type: 'output',

  factory: function(el, width, height) {

    var firstRun = true;
    var scatter = d3scatter(el).width(width).height(height);

    var sel_handle = new crosstalk.SelectionHandle();

    scatter.on("brush", function(keys) {
      sel_handle.set(keys);
    });

    sel_handle.on("change", function(e) {
      if (e.sender !== sel_handle) {
        scatter.clearBrush();
      }
      scatter.selection(e.value);
    });

    return {
      renderValue: function(x) {
        var value = x.data;
        scatter
          .x_var(value.x_var)
          .y_var(value.y_var)
          .color_var(value.color_var)
          .color_spec(value.color_spec)
          .x_label(value.x_label)
          .y_label(value.y_label)
          .x_lim(value.x_lim)
          .y_lim(value.y_lim)
          .key(x.settings.crosstalk_key);

        sel_handle.setGroup(x.settings.crosstalk_group);

        scatter(!firstRun);
        firstRun = false;
      },
      resize: function(width, height) {
        scatter.width(width).height(height)(false);
      }
    };
  }
});

我正在考虑将创建放入renderValue()，因为在很多情况下我的小部件不会使用sharedData，所以我不想在crosstalkLibs中进行不必要的链接。但在x中第一次看到renderValue之前，我不会知道这一点。

示例代码最终可能是这样的：

HTMLWidgets.widget({

  name: 'd3scatter',

  type: 'output',

  factory: function(el, width, height) {

    var firstRun = true;
    var scatter = d3scatter(el).width(width).height(height);

    return {
      renderValue: function(x) {
        var value = x.data;
        scatter
          .x_var(value.x_var)
          .y_var(value.y_var)
          .color_var(value.color_var)
          .color_spec(value.color_spec)
          .x_label(value.x_label)
          .y_label(value.y_label)
          .x_lim(value.x_lim)
          .y_lim(value.y_lim)
          .key(x.settings.crosstalk_key);

        if (firstRun && typeof x.settings !== "undefined") {
          scatter.sel_handle = new crosstalk.SelectionHandle();

          scatter.on("brush", function(keys) {
            scatter.sel_handle.set(keys);
          });

          scatter.sel_handle.on("change", function(e) {
            if (e.sender !== sel_handle) {
              scatter.clearBrush();
            }
            scatter.selection(e.value);
          });

          scatter.sel_handle.setGroup(x.settings.crosstalk_group);
        }
        scatter(!firstRun);
        firstRun = false;
      },
      resize: function(width, height) {
        scatter.width(width).height(height)(false);
      }
    };
  }
});

这是未经测试的代码，因此它可能包含拼写错误，但这种一般方法会导致问题吗？

Answer 1

经过几天的实验：我的问题的答案是样本方法有效，但没有必要。建议的代码修改中至少有一个错误：更改消息是否来自同一组件的测试应该是

if (e.sender !== this) {
  scatter.clearBrush();
}

但总的来说这种方法很好。

何时创建crosstalk.SelectionHandle

1 个答案: