小编Swe*_*sus的帖子

首先,我对javascript及其库d3.js相当不熟悉,但我熟悉R.使用Shiny创建仪表板非常有趣(感谢stackoverflow).现在我想通过连接d3元素来扩展它.

我正在寻找有关如何将javascript实际绑定到Shiny(R仪表板)并解释实际情况的信息来源.

背景:我在w3schools上做了关于js和jquery的教程,并使用Scott Murray的书(Web上的交互式数据可视化)学习了一些关于d3的知识.我希望这足以让我理解有关如何在Shiny网站上构建自定义输入/输出绑定的示例和解释:

http://shiny.rstudio.com/articles/building-inputs.html

但不幸的是,我没有,我似乎无法找到任何最小工作代码的例子.关于github的许多例子都让我很难解剖,很可能是因为我对javascript的经验很少.以下是使用javascript自定义输入绑定的示例:

https://github.com/jcheng5/shiny-js-examples/tree/master/input

这是我尝试展开的输入和输出绑定的示例:

<script src="http://d3js.org/d3.v3.js"></script>
<script type="text/javascript">
(function(){
  // Probably not idiomatic javascript.

  this.countValue=0;

  // BEGIN: FUNCTION
  updateView = function(message) {

    var svg = d3.select(".d3io").select("svg")

    svg.append("text")
      .transition()
      .attr("x",message[0])
      .attr("y",message[1])
      .text(countValue)
      .each("end",function(){
        if(countValue<100) {
          countValue+=1;
          $(".d3io").trigger("change");
        }
      })
  }
  // END: FUNCTION

  //BEGIN: OUTPUT BINDING
  var d3OutputBinding = new Shiny.OutputBinding();
  $.extend(d3OutputBinding, {
    find: function(scope) {
      return $(scope).find(".d3io");
    },
    renderError: function(el,error) {
      console.log("Foe");
    },
    renderValue: function(el,data) {
      updateView(data);
      console.log("Friend");
    }
  });
  Shiny.outputBindings.register(d3OutputBinding);
  //END: OUTPUT BINDING

  //BEGIN: INPUT …