diff --git a/.DS_Store b/.DS_Store index b83da9b..53718d6 100644 Binary files a/.DS_Store and b/.DS_Store differ diff --git a/DESCRIPTION b/DESCRIPTION index 7c0e865..26e7228 100644 --- a/DESCRIPTION +++ b/DESCRIPTION @@ -1,7 +1,7 @@ Package: shinysense Type: Package Title: Lets Shiny Sense The World Around -Version: 0.1.1 +Version: 0.1.5 Author: Nick Strayer Maintainer: Nick Strayer Description: shinysense is a collection of modules written for shiny that allows the easy addition of data collection to shiny apps. diff --git a/R/shinydrawr.R b/R/shinydrawr.R index 047bca0..684e6df 100644 --- a/R/shinydrawr.R +++ b/R/shinydrawr.R @@ -42,6 +42,7 @@ shinydrawrUI <- function(id, ...) { #' @param data dataframe containing data you want to plot in two of its columns #' @param draw_start position on the x-axis the true data is blocked off and the user is to draw from. #' @param raw_draw set to true if you want to not draw any line, just let the user draw everything. Auto sets draw_start to begining of data. +#' @param draw_after set to true of you want the true data drawn after all points are drawn by the user. #' @param x_key name of the x column. #' @param y_key name of the y column. #' @param y_min value of the lowest possible value the user is allowed to draw, defaults to lowest seen in data. @@ -61,21 +62,31 @@ shinydrawr <- function(input, output, session, data, draw_start, raw_draw = FALSE, + draw_after = TRUE, x_key = "x", y_key = "y", y_min = NA, y_max = NA){ #set chart maximum y of the data's max y if nothing has been specified. - if(is.na(y_min)) y_min <- min(data[y_key]) - if(is.na(y_max)) y_max <- max(data[y_key]) - if(raw_draw) draw_start <- min(data[x_key]) + if(is.na(y_min)) { + y_min <- min(data[y_key]) + } + if(is.na(y_max)) { + y_max <- max(data[y_key]) + } + if(raw_draw) { + draw_start <- min(data[x_key]) + } data_jsonified <- jsonlite::toJSON(data) #the id of our given recorder button. We send this to javascript. chart_id <- gsub("-", "", session$ns("")) + x_is_date = is.Date(data[x_key]) + + data[x_key] = as.character(data[x_key]) #Send over a message to the javascript with the id of the div we're placing this chart in along with the data we're placing in it. observe({ session$sendCustomMessage( type = "initialize_chart", @@ -84,9 +95,11 @@ shinydrawr <- function(input, output, session, id = chart_id, reveal_extent = draw_start, raw_draw = raw_draw, + draw_after = draw_after, x_key = x_key, y_key = y_key, - y_domain = c(y_min,y_max) + y_domain = c(y_min,y_max), + x_is_date = x_is_date ) ) }) diff --git a/R/shinymovr.R b/R/shinymovr.R index 5841fea..392de99 100644 --- a/R/shinymovr.R +++ b/R/shinymovr.R @@ -34,8 +34,9 @@ shinymovrUI <- function(id) { #' @param output you can ignore this as it is taken care of by shiny #' @param session you can ignore this as it is taken care of by shiny #' @export -#' @examples -#' movrData <- callModule(shinymovr) +#' @examples \dontrun{ +#' movrData <- callModule(shinymovr) +#' } shinymovr <- function(input, output, session){ diff --git a/demo/00Index b/demo/00Index index 3d71859..6608f9e 100644 --- a/demo/00Index +++ b/demo/00Index @@ -2,3 +2,5 @@ earr_demo demo for earr swipr_demo demo for swipr drawr_demo demo for drawr popup_demo demo for popup +draw_distribution demo for drawr with distribution +movr_demo demo with movr diff --git a/inst/.DS_Store b/inst/.DS_Store index ba3b77f..4cbe4e1 100644 Binary files a/inst/.DS_Store and b/inst/.DS_Store differ diff --git a/inst/js/drawr.js b/inst/js/drawr.js index f0a5ca9..1b506e8 100644 --- a/inst/js/drawr.js +++ b/inst/js/drawr.js @@ -1,7 +1,8 @@ //logic for returning to shiny goes here. const sendToShiny = (id) => { const send_dest = id + "-doneDragging"; - + console.log("send dest"); + console.log(send_dest); return (data) => Shiny.onInputChange(send_dest, data.map(d=>d.y)) }; @@ -15,6 +16,7 @@ $(document).on('shiny:connected', event => { params.dom_target = "#" + params.id + '-youDrawIt'; //where we place the chart params.on_done_drawing = sendToShiny(params.id); //function that sends data back to shiny. const ourChart = new youDrawIt(params); //initialize the chart itself. + console.log("sending params to shiny"); console.log(params); } ); diff --git a/inst/js/libraries/youDrawIt.js b/inst/js/libraries/youDrawIt.js index d37a403..c767f65 100644 --- a/inst/js/libraries/youDrawIt.js +++ b/inst/js/libraries/youDrawIt.js @@ -16893,11 +16893,22 @@ var makeScales = function makeScales(_ref3) { var data = _ref3.data, y_domain = _ref3.y_domain, height = _ref3.height, - width = _ref3.width; - - var x = d3.scaleLinear().domain(d3.extent(data, function (d) { - return d.x; - })).range([0, width]); + width = _ref3.width, + x_is_date = _ref3.x_is_date; + if (x_is_date) { + var formatter = d3.time.format("%Y-%m-%d").parse; + console.log("ScaleTime is running"); + var x = d3.scaleTime() + .domain([new Date(2016, 0, 1), new Date(2018, 0, 1)]) + .range([0, width]); + // var x = d3.scaleTime().domain(d3.extent(data, function (d) { + // return formatter(d.x); + // })); + } else { + var x = d3.scaleLinear().domain(d3.extent(data, function (d) { + return d.x; + })).range([0, width]); + } var y = d3.scaleLinear().domain(y_domain).range([height, 0]); @@ -16937,6 +16948,23 @@ var clamp = function clamp(a, b, c) { return Math.max(a, Math.min(b, c)); }; +var makeSubData = function makeSubData(_ref7) { + var data = _ref7.data, + reveal_extent = _ref7.reveal_extent; + return data.map(function (d) { + return { + x: d.x, + y: d.y, + defined: d.x == reveal_extent + }; + }).filter(function (d) { + return d.x <= reveal_extent; + } + + //append invisible rectangle covering plot so d3drag can see what's going on + ); +}; + var makeUserData = function makeUserData(_ref7) { var data = _ref7.data, reveal_extent = _ref7.reveal_extent; @@ -16956,6 +16984,7 @@ var makeUserData = function makeUserData(_ref7) { var svg = _ref8.svg, width = _ref8.width, height = _ref8.height; + console.log("Drawing a Rectangle"); return svg.append('rect').attr("width", width).attr("height", height).attr("opacity", 0); }; @@ -17001,6 +17030,7 @@ module.exports = { makeClip: makeClip, drawAxes: drawAxes, makeUserData: makeUserData, + makeSubData: makeSubData, dragCanvas: dragCanvas, clamp: clamp, addToClosest: addToClosest, @@ -17054,6 +17084,7 @@ var _require = require('./helpers'), drawAxes = _require.drawAxes, dragCanvas = _require.dragCanvas, makeUserData = _require.makeUserData, + makeSubData = _require.makeSubData, clamp = _require.clamp, addToClosest = _require.addToClosest, drawStartValue = _require.drawStartValue; @@ -17071,12 +17102,16 @@ var drawIt = function drawIt(params) { total_height = _params$total_height === undefined ? 400 : _params$total_height, _params$raw_draw = params.raw_draw, raw_draw = _params$raw_draw === undefined ? false : _params$raw_draw, + _params$draw_after = params.draw_after, + draw_after = _params$draw_after === undefined ? false : _params$draw_after, + _params$x_is_date = params.x_is_date, + x_is_date = _params$x_is_date === undefined ? false : _params$x_is_date, _params$on_done_drawi = params.on_done_drawing, on_done_drawing = _params$on_done_drawi === undefined ? function (d) { return console.table(d); } : _params$on_done_drawi; - console.log("THis is working!"); + console.log("This is working!"); var sel = d3.select(dom_target).html(''), data = simplifyData({ fullData: fullData, x_key: x_key, y_key: y_key }), @@ -17087,7 +17122,7 @@ var drawIt = function drawIt(params) { _y_domain = _slicedToArray(y_domain, 2), y_min = _y_domain[0], y_max = _y_domain[1], - scales = makeScales({ data: data, y_domain: y_domain, height: height, width: width, margin: margin }), + scales = makeScales({ data: data, y_domain: y_domain, height: height, width: width, margin: margin, x_is_date: x_is_date }), x_max = scales.x.domain()[1], line = makeLine({ scales: scales }), clipRect = makeClip({ svg: svg, scales: scales, reveal_extent: reveal_extent, height: height }); @@ -17102,9 +17137,13 @@ var drawIt = function drawIt(params) { var trueLine = svg.append('g').attr('clip-path', 'url(#clip)'); - if (!raw_draw) { + if (!raw_draw & draw_after) { //Draw the data's true line. trueLine.append('path').attr("d", line(data)).style("stroke", "black").style("stroke-width", 3).style("fill", "none"); + } + if (!raw_draw & !draw_after) { + var usersData2 = makeSubData({ data: data, reveal_extent: reveal_extent }); + trueLine.append('path').attr("d", line(usersData2)).style("stroke", "black").style("stroke-width", 3).style("fill", "none"); } //plot the axes @@ -17115,7 +17154,8 @@ var drawIt = function drawIt(params) { });var makeDragger = function makeDragger(_ref) { var scales = _ref.scales, reveal_extent = _ref.reveal_extent, - raw_draw = _ref.raw_draw; + raw_draw = _ref.raw_draw, + draw_after = _ref.draw_after; return d3.drag().on('drag', function () { var pos = d3.mouse(this); //current drag position @@ -17137,17 +17177,20 @@ var drawIt = function drawIt(params) { })(usersData //if we've drawn for all the hidden datapoints, reveal them. - ));if (d3.mean(usersData, function (d) { - return d.defined; - }) === 1 && !this.raw_draw) { - clipRect.transition().duration(1000).attr('width', scales.x(x_max)); - } + ));if (draw_after) { + console.log("draw_after is TRUE here"); + if (d3.mean(usersData, function (d) { + return d.defined; + }) === 1 && !this.raw_draw ) { + clipRect.transition().duration(1000).attr('width', scales.x(x_max)); + } + } }).on('end', function () { on_done_drawing(usersData); }); }; - var dragger = makeDragger({ scales: scales, reveal_extent: reveal_extent, raw_draw: raw_draw }); + var dragger = makeDragger({ scales: scales, reveal_extent: reveal_extent, raw_draw: raw_draw, draw_after: draw_after }); svg.call(dragger); }; diff --git a/man/shinydrawr.Rd b/man/shinydrawr.Rd index b04837d..a3b31ce 100644 --- a/man/shinydrawr.Rd +++ b/man/shinydrawr.Rd @@ -4,8 +4,8 @@ \alias{shinydrawr} \title{Gather recorded data from UI.} \usage{ -shinydrawr(input, output, session, data, draw_start, x_key = "x", - y_key = "y", y_min = NA, y_max = NA) +shinydrawr(input, output, session, data, draw_start, raw_draw = FALSE, + draw_after = TRUE, x_key = "x", y_key = "y", y_min = NA, y_max = NA) } \arguments{ \item{input}{you can ignore this as it is taken care of by shiny} @@ -18,6 +18,10 @@ shinydrawr(input, output, session, data, draw_start, x_key = "x", \item{draw_start}{position on the x-axis the true data is blocked off and the user is to draw from.} +\item{raw_draw}{set to true if you want to not draw any line, just let the user draw everything. Auto sets draw_start to begining of data.} + +\item{draw_after}{set to true of you want the true data drawn after all points are drawn by the user.} + \item{x_key}{name of the x column.} \item{y_key}{name of the y column.} diff --git a/man/shinymovr.Rd b/man/shinymovr.Rd index 35de514..e09df6f 100644 --- a/man/shinymovr.Rd +++ b/man/shinymovr.Rd @@ -17,5 +17,7 @@ shinymovr(input, output, session) Contains a reactive variable that will update as new data comes in. } \examples{ - movrData <- callModule(shinymovr) +\dontrun{ +movrData <- callModule(shinymovr) +} }