如何在闪亮的应用程序中呈现HTML绘图

Question

我想在闪亮的应用中呈现HTML情节 我从http://www.buildingwidgets.com/blog/2015/12/9/week-49-d3radarr

中提到雷达图

但是这个情节并没有呈现给闪亮的应用程序。

我提到这个问题 plotGoogleMaps in shiny app

但它有点不同。

有没有办法在闪亮的app中渲染这个情节？

我的代码如下：

library(shiny)
library(d3radarR)
library(jsonlite)

dataset = jsonlite::fromJSON(
'
  [  
    {  
      "key":"Nokia Smartphone",
      "values":[  
        {  "axis":"Battery Life", "value":0.26 }, {  "axis":"Brand", "value":0.10 },
        {  "axis":"Contract Cost", "value":0.30 }, {  "axis":"Design And Quality", "value":0.14 },
        {  "axis":"Have Internet Connectivity", "value":0.22 }, {  "axis":"Large Screen", "value":0.04 },
        {  "axis":"Price Of Device", "value":0.41 }, {  "axis":"To Be A Smartphone", "value":0.30 }
        ]
    },
    {  
      "key":"Samsung",
      "values":[  
        {  "axis":"Battery Life", "value":0.27 }, {  "axis":"Brand", "value":0.16 },
        {  "axis":"Contract Cost", "value":0.35 }, {  "axis":"Design And Quality", "value":0.13 },
        {  "axis":"Have Internet Connectivity", "value":0.20 }, {  "axis":"Large Screen", "value":0.13 },
        {  "axis":"Price Of Device", "value":0.35 }, {  "axis":"To Be A Smartphone", "value":0.38 }
        ]
    },
    {  
      "key":"iPhone",
      "values":[  
        {  "axis":"Battery Life", "value":0.22 }, {  "axis":"Brand", "value":0.28 },
        {  "axis":"Contract Cost", "value":0.29 }, {  "axis":"Design And Quality", "value":0.17 },
        {  "axis":"Have Internet Connectivity", "value":0.22 }, {  "axis":"Large Screen", "value":0.02 },
        {  "axis":"Price Of Device", "value":0.21 }, {  "axis":"To Be A Smartphone", "value":0.50 }
        ]
    }
  ]
',
  simplifyDataFrame = FALSE
) 


ui <- pageWithSidebar(

  headerPanel("Rader Chart"),

  sidebarPanel(

    selectInput('tmp1', 'Tmp1', c(None='.')),
    selectInput('tmp2', 'Tmp2', c(None='.'))

  ),

  mainPanel(
    tabPanel("Plot", uiOutput('plot'))
  )
)

server <- function(input, output) {

  output$plot <- renderUI({
    d3radar(json_data)
  })
}

shinyApp(ui=ui, server=server)

Answer 1

您需要使用d3radarR包中的特定闪亮功能：

dataset = jsonlite::fromJSON(
  '
  [  
  {  
  "key":"Nokia Smartphone",
  "values":[  
  {  "axis":"Battery Life", "value":0.26 }, {  "axis":"Brand", "value":0.10 },
  {  "axis":"Contract Cost", "value":0.30 }, {  "axis":"Design And Quality", "value":0.14 },
  {  "axis":"Have Internet Connectivity", "value":0.22 }, {  "axis":"Large Screen", "value":0.04 },
  {  "axis":"Price Of Device", "value":0.41 }, {  "axis":"To Be A Smartphone", "value":0.30 }
  ]
  },
  {  
  "key":"Samsung",
  "values":[  
  {  "axis":"Battery Life", "value":0.27 }, {  "axis":"Brand", "value":0.16 },
  {  "axis":"Contract Cost", "value":0.35 }, {  "axis":"Design And Quality", "value":0.13 },
  {  "axis":"Have Internet Connectivity", "value":0.20 }, {  "axis":"Large Screen", "value":0.13 },
  {  "axis":"Price Of Device", "value":0.35 }, {  "axis":"To Be A Smartphone", "value":0.38 }
  ]
  },
  {  
  "key":"iPhone",
  "values":[  
  {  "axis":"Battery Life", "value":0.22 }, {  "axis":"Brand", "value":0.28 },
  {  "axis":"Contract Cost", "value":0.29 }, {  "axis":"Design And Quality", "value":0.17 },
  {  "axis":"Have Internet Connectivity", "value":0.22 }, {  "axis":"Large Screen", "value":0.02 },
  {  "axis":"Price Of Device", "value":0.21 }, {  "axis":"To Be A Smartphone", "value":0.50 }
  ]
  }
  ]
  ',
  simplifyDataFrame = FALSE
) 


ui <- pageWithSidebar(

  headerPanel("Rader Chart"),

  sidebarPanel(

    selectInput('tmp1', 'Tmp1', c(None='.')),
    selectInput('tmp2', 'Tmp2', c(None='.'))

  ),

  mainPanel(
    tabPanel("Plot", d3radarOutput('plot'))
  )
)

server <- function(input, output) {

  output$plot <- renderD3radar({
    d3radar(dataset)
  })
}

shinyApp(ui=ui, server=server)