rglwidgetaux.js

Question

我有一个闪亮的应用程序，并将一个rgl 3d-plot集成到其中。我正在使用renderRglwidget包中的rglwidget将使用webgl的rgl图形插入到我的闪亮应用中。

在应用程序中，用户可以旋转图形。现在我想保存旋转状态，因此userMatrix或modelMatrix稍后会生成一个类似的绘图，其旋转方向与用户离开上一个图形时相同。

Here我读了一些关于存储userMatrix和其他参数的java变量。我可以从我的闪亮应用程序（R代码）中访问它们吗？

在rgl中，我可以使用rotationMatrix <- rgl.projection()$model或rotationMatrix <- par3d()$modelMatrix来存储模型的旋转。但是，因为在我的情况下，图形不会在rgl中旋转，这些功能对我没有帮助。

我试过的是：

library(shiny)
library(rgl)
library(rglwidget)

ui <- fluidPage(
  rglwidgetOutput("3D-plot"),
  actionButton("showMatrix", "show rotation Matrix")
)

server <- function(input, output, session){
  open3d(useNULL = T)
  x <- sort(rnorm(1000))
  y <- rnorm(1000)
  z <- rnorm(1000) + atan2(x, y)
  plot3d(x, y, z, col = rainbow(1000))
  scene1 <- scene3d()
  rgl.close()

  output$"3D-plot" <- renderRglwidget({
    rglwidget(scene1)
  })
  observe({
    input$showMatrix
    par3d()$modelMatrix
  })
}


shinyApp(ui=ui, server=server)

但par3d()$modelMatrix似乎没有返回任何内容。

Answer 1

rgl:par3d()没有返回任何内容的原因是因为rgl包实际上没有管理场景闪亮。利用rglwidget的基于javascript的WebGL库正在管理它，并且您正在将场景复制到另一个非常兼容的GL库（可能他们甚至使用相同的编译库，但我怀疑它）并显示那有光泽的。因此rgl.dev()对您没有帮助。

AFAIK，获取这些值并不容易，因为它们隐藏在rglwidget javascript中，但我想要了解它们，所以我构建了一个闪亮的自定义输入控件，可以做到这一点。这是一项相当多的工作，可能有一种更简单的方法，但我没有看到它，至少我知道如何构建自定义输入控件以便现在闪亮。如果有人知道更简单的方法，请赐教。

这是javascript，它会进入www子文件夹，您将其保存在与闪亮代码相同的目录中。

rglwidgetaux.js

// rglwidgetaux control for querying shiny rglwiget

var rglwidgetauxBinding = new Shiny.InputBinding();
$.extend(rglwidgetauxBinding, {
  find: function(scope) {
    return $(scope).find(".rglWidgetAux");
  },
  getValue: function(el) {
    return el.value;
  },
  setValue: function(el, value) {
  //  $(el).text(value);
     el.value = value;
  },
  getState: function(el) {
    return { value: this.getValue(el) };
  },
   receiveMessage: function(el, data) {
    var $el = $(el);

    switch (data.cmd) {
       case "test":alert("Recieved Message");
                    break;
       case "getpar3d":
                    var rglel = $("#"+data.rglwidgetId);
                    if (rglel.length===0){
                       alert("bad rglwidgetId:"+ data.rglwidgetId);
                       return null;
                    }
                    var rglinst = rglel[0].rglinstance;
                    var sid = rglinst.scene.rootSubscene;
                    var par3d = rglinst.getObj(sid).par3d;
                    this.setValue(el,JSON.stringify(par3d));
                    $el.trigger("change"); // tell myself that I have changed
                    break;
    }
  },  
  subscribe: function(el, callback) {
    $(el).on("change.rglwidgetauxBinding", function(e) {
      callback();
    });
  },
  unsubscribe: function(el) {
    $(el).off(".rglwidgetauxBinding");
  }
});
Shiny.inputBindings.register(rglwidgetauxBinding);

这是R /闪亮代码。它使用通常的测试场景，并有一个按钮来查询场景userMatrix并将其显示在表格中。我使用了userMatrix而不是modelMatrix，因为前者很容易用鼠标更改，因此您可以看到您获得了最新的值。

请注意名称＆＃34; app.R＆＃34;不是真的可选。您必须使用它，或将文件拆分为＆＃34; ui.R＆＃34;和＆＃34; server.R＆＃34;，否则它不会导入上面的javascript文件。

app.R

library(shiny)
library(rgl)
library(htmlwidgets)
library(jsonlite)

rglwgtctrl <- function(inputId, value="", nrows, ncols) {
  # This code includes the javascript that we need and defines the html
  tagList(
    singleton(tags$head(tags$script(src = "rglwidgetaux.js"))),
    tags$div(id = inputId,class = "rglWidgetAux",as.character(value))
  )
}

ui <- fluidPage(
    rglwgtctrl('ctrlplot3d'),
    actionButton("regen", "Regen Scene"),
    actionButton("queryumat", "Query User Matrix"),
    rglwidgetOutput("plot3d"),
    tableOutput("usermatrix")
)

server <- function(input, output, session) 
{
  observe({
    # tell our rglWidgetAux to query the plot3d for its par3d
    input$queryumat
    session$sendInputMessage("ctrlplot3d",list("cmd"="getpar3d","rglwidgetId"="plot3d"))
  })

  output$usermatrix <- renderTable({
    # grab the user matrix from the par3d stored in our rglWidgetAux
    # note we are using two different "validate"s here, which is quite the pain if you 
    # don't notice that it is declared in two different libraries
    shiny::validate(need(!is.null(input$ctrlplot3d),"User Matrix not yet queried"))
    umat <- matrix(0,4,4)
    jsonpar3d <- input$ctrlplot3d
    if (jsonlite::validate(jsonpar3d)){
      par3dout <- fromJSON(jsonpar3d)
      umat <- matrix(unlist(par3dout$userMatrix),4,4) # make list into matrix
    }
    return(umat)
  })

  scenegen <- reactive({
     # make a random scene
     input$regen
     n <- 1000
     x <- sort(rnorm(n))
     y <- rnorm(n)
     z <- rnorm(n) + atan2(x, y)
     plot3d(x, y, z, col = rainbow(n))
     scene1 <- scene3d()
     rgl.close() # make the app window go away
     return(scene1)
  })
  output$plot3d <- renderRglwidget({ rglwidget(scenegen()) })
}

shinyApp(ui=ui, server=server)

最后这就是它的样子：

请注意，我将其设置为可以向其添加命令，您可以（可能）使用基于此控件的控件更改参数和其他任何内容。

另请注意，此处的par3d结构（转换为json，然后转换为rglwidget javascript中的R）和rgl中的结构不完全相同，所以例如我有为了展平userMatrix，因为WebGL似乎更喜欢它作为名单而不是其他矩阵按预期结束。

闪亮的应用程序rglwidget让userMatrix生成另一个具有相同轮换的绘图

1 个答案:

rglwidgetaux.js

app.R