How to load api (@serializer htmlwidget) into my own html?

[shizidushu]

I want to create a api return htmlwidget and then use it in my own html/js file.

It is easy to do the first part with @serializer htmlwidget

I want to fetch the api and then load the htmlwidget into my html.

After searching with Google, I only find to use iframe or object tag to do it like the following.

<object data="http://127.0.0.1:8000/plotly" width="100%" height="500" type="text/html"> </object>

But the ideal way in my mind to load it is:

• Using vue framework (optional)
• Send http request with axios
• Then load the result into html

I spend a lot of time to figure out it but without sucess. (I don't know much about html/javascript)

Can someone help me with this?

[shizidushu]

I find a better way to do with htmlwidget.

Extract x from the htmlwidget object then serve is as unboxedJSON. Finally, render it in javascript.

I just test it with recharts library but I guess this approach applies to other htmlwidget based library.

Thanks to recharts document. I got some idea about how a htmlwidget library was constructed after reading it.

#' json 1
#' @serializer unboxedJSON
#' @get /json1
function(){
  library(recharts)
  require(plyr)

  series = list(list(
    name = 'Sales',
    type = 'bar',
    data = c(5, 20, 36, 10, 10, 20)
  ))
  # 定义坐标轴部分
  ext = list(
    xAxis = list(list( 
      data = c('shirt','cardign','chiffon shirt','pants','heels','socks')
    )),
    yAxis = list(list())
  )
  # 绘制
  p <- ePlot(series, ext)
  p$x
}

[brettkobo]

I was also having issue with this. Looked at a example that Jeff Allen wrote for his webinar on plumber.

Looks like an easy way is to create a empty