This is the base of gior
for you to easily follow along the how to build htmlwidgets blogpost and build the htmlwidget for gio.js yourself!
Clone this repository with git clone https://github.com/JohnCoene/base-gior.git
, or, from RStudio:
File
New Project
Version Control
Git
https://github.com/JohnCoene/base-gior.git
) under Repository URL
Create Project
.Here are the only functions that were ran:
devtools::create("gior")
htmlwiidgets::scaffoldWidget("gior")
Essentially creating a package with devtools
and scaffolding the htmlwidget from the root of the package. You should be familiar with the first function. The second function essentially builds the following:
R/
| gior.R
inst/
|-- htmlwidgets/
| |-- gior.js
| |-- gior.yaml
Simply for convenience and for one to quickly get on with building the widget, some files were already edited or added.
Edited some meta information that you should change and added necessary Imports
:
htmlwidgets
shiny
jsonlite
The gior.yml
file located in the inst
folder was edited from:
# (uncomment to add a dependency)
# dependencies:
# - name:
# version:
# src:
# script:
# stylesheet:
to
dependencies:
- name: three
version: 97
src: htmlwidgets/lib/three
script: three.min.js
- name: gio
version: 2.0
src: htmlwidgets/lib/gio-2.0
script: gio.min.js
The blogpost explains what this file does.
The lib
directory (and its sub directories); we essentially added the dependencies (that are referred to in the YML section above)
R/
| gior.R
inst/
|-- htmlwidgets/
| |-- gior.js
| |-- gior.yaml
| |-- lib/
| | |-- gio-2.0/
| | | |-- gio.min.js
| | |-- three/
| | | |-- three.min.js
The package also includes random data for you to test your package which can be loaded with data("country_data")
.
This is a package, remember that to see changes reflected you will have to run:
devtools::document()
devtools::install()
or CTRL/CMD + SHIFT + B
from RStudio.Note that, as is, the package works but does not pass R CMD Check
.
Add the following code to your website.
For more information on customizing the embed code, read Embedding Snippets.