simpleD3Scatter.R

library(tidyverse)
library(htmltools)
# devtools::install_github('ramnathv/htmlwidgets')
library(htmlwidgets)
# devtools::install_github('timelyportfolio/d3r')
library(d3r)

data <- data_frame(x = rnorm(50), y = rnorm(50));

browsable(
  tagList(
    tags$script(HTML("
HTMLWidgets.widget({
name: 'awidget',
type: 'output',
factory: function(el, width, height) {
  const svg = d3.select(el).append('svg')
    .attr('width', width)
    .attr('height', height);
  const padding = 25;
  const x_scale = d3.scaleLinear().range([padding, width]);
  const y_scale = d3.scaleLinear().range([height, padding]);
  return {
  renderValue: function(x) {
    const scatter_data = HTMLWidgets.dataframeToD3(x.data);
    x_scale.domain(d3.extent(scatter_data, d => d.x));
    y_scale.domain(d3.extent(scatter_data, d => d.y));
    
    svg.selectAll('.scatter_points')
      .data(scatter_data)
      .enter().append('circle')
      .attr('cx', d => x_scale(d.x))
      .attr('cy', d => y_scale(d.y))
      .attr('r', 5);
  },
  resize: function(width, height) { }
  };
}
});
  ")),
    createWidget("awidget", x=list(data = data)),
    d3_dep_v4()
  )
)