mrjoh3 / c3 Goto Github PK
View Code? Open in Web Editor NEWc3 HTMLWidget Ploting
c3 HTMLWidget Ploting
Hi,
It looks like this javascript issue is replicated in the latest c3 library available on CRAN.
In particular, tooltips and mouse events do not trigger with Pie charts - including the default settings.
Once some class is modified in CSS, it works immediately.
Here are two reproducible examples that are supposed to result in the same chart (with hover-events!):
library(shiny) library(c3) ui <- fluidPage( titlePanel("C3 Test"), mainPanel( tags$style(".c3-event-rects { display: none; }"), c3Output("plot1") ) ) server <- function(input, output) { output$plot1 <- renderC3({ data.frame(sugar = 20, fat = 45, salt = 10) %>% c3() %>% c3_pie() }) } shinyApp(ui = ui, server = server)
data.frame(sugar = 20, fat = 45, salt = 10) %>% c3() %>% c3_pie()
Disclaimer: I'm unable to produce 'reproducible' code because of the following reasons:
c3_pie
works but c3_gauge
does notc3_gauge
works but c3_pie
does notDefinition: "not working": svg is created and rendered in the browser, but it is blank
The input types for charts are:
Summary of attempts, successes and failures:
The input to charts is a reactiveValues
object that updates based on user's inputs. In both cases I'm using c3::c3Output(...)
and defined a suitable output$... <- c3::renderC3({ ... })
. To be safe I avoided using %>%
and returned c3_pie()
or c3_gauge
object. I saved (cached) the data frame used for plotting, read it in R and plotted (c3_gauge or c3_pie) - it worked as expected. I also observed that replacing the dynamic data with static data (Eg: data.frame(x=10, y=10)
) makes the plot appear in R shiny. I experimented a bit more and found that there is no clear relationship between the type of data (reactive or static) and the behavior of the R shiny output.
Is there a universal fix for this problem?
c3_selection() does not work unless a JS() wrapped function is supplied to the variable isselectable
iris_tibble <- iris %>%
as_tibble()
iris_tibble %>%
c3(x = 'Sepal_Length',
y = 'Sepal_Width',
group = 'Species') %>%
c3_line('line')
This results in a blank plot for me using RStudio 1.1.453 and R3.5.
If iris is plotted directly:
iris %>%
c3(x = 'Sepal_Length',
y = 'Sepal_Width',
group = 'Species') %>%
c3_line('line')
then it works beautifully.
(This really is a beautiful plotting package).
I want to add onclick event to chart in Shiny App. I`v read this article with c3 examples and try to do some simple app with print in console when clicked on chart. But in my case, onclick I have this error in console. Could you, please, say what I do wrong?
library(c3)
library(shiny)
shinyApp(
ui = fluidPage(
c3Output("c3test")
),
server = function(input, output, session) {
output$c3test <- renderC3({
pie.chart <- data.frame(sugar=20,fat=45,salt=10) %>%
c3(onclick="function(d,element) {
console.log(d.id);
}") %>%
c3_donut()
})
}
)
Add Labels to a scatter plot. This is not implimented in c3 but is likely a desired functionality. This Stack Overflow post outlines a method that could be implimented here
Hi,
first of all thanks for packing this library into htmlwidgets.
I created chart in shiny, however I would like to update it dynamically.
I'm thinking about executing custom JS code from Shiny, however I cannot access object of chart to run some of its methods.
Do you provide any update methods or access to chart's objects?
Can you share some docs about it, if it's available?
Thanks again!
Here is my code and I do not see any documentation on how to do this:
library(c3)
data <- data.frame(structure(
list(
Time = structure(c(6939, 7304, 7669, 8034, 8400,
8765), class = "Date"),
`Access Vector Required-ADJACENT_NETWORK-HIGH` = c(0,
0, 0, 0, 0, 0),
`Access Vector Required-ADJACENT_NETWORK-LOW` = c(0,
0, 0, 0, 0, 0),
`Access Vector Required-ADJACENT_NETWORK-MEDIUM` = c(0,
0, 0, 0, 0, 0),
`Access Vector Required-LOCAL-HIGH` = c(0, 0,
0, 1, 0, 0),
`Access Vector Required-LOCAL-LOW` = c(0, 2, 8,
8, 6, 8),
`Access Vector Required-LOCAL-MEDIUM` = c(0, 0, 0,
0, 0, 0),
`Access Vector Required-NETWORK-HIGH` = c(0, 0, 0,
0, 0, 0),
`Access Vector Required-NETWORK-LOW` = c(2, 1, 3, 6,
7, 5),
`Access Vector Required-NETWORK-MEDIUM` = c(0, 0, 0, 0,
0, 0)
),
row.names = c(NA, 6L),
class = "data.frame"
))
data %>%
c3(x = 'Time')
I want it to display 1988-12-31
or just 1988
Hi,
When some c3 visualisation is inserted into a shiny page, the height parameter does not seem to work.
I am not sure if its related to this issue but it is slightly difficult to use it right now in large Shiny Applications.
Here is a working minimal example:
library(shiny)
library(shinydashboard)
data <- data.frame(a = c(1,2,3,2), b = c(2,3,1,5))
shinyApp(
ui = dashboardPage(
dashboardHeader(),
dashboardSidebar(),
dashboardBody(
tags$head(tags$style("#plot1{height:100vh !important;}")),
tags$head(tags$style("#plot2{height:100vh !important;}")),
fluidRow(
column(6,c3Output("plot1", "100%", "100%")),
column(6,plotOutput("plot2", "100%", "100%"))
)
)
),
server = function(input, output) {
output$plot1 <- renderC3({
data %>%
c3()
})
output$plot2 <- renderPlot({
plot(data)
})
}
)
firstly, many thanks for a great package! trying to use c3_bar with the code below, which produces a bar chart with three bars in one group, with no gaps between bars. how may I code it to produce the bars in three separate groups. thanks!
library(c3)
data.frame(a=1, b=3, c=2) %>%
c3() %>%
c3_bar()
I'm trying to create a chart where one series (a
) is mapped to the primary y-axis as a line chart and another series on a different scale (b
) is mapped to the secondary y-axis as an area chart. There is an exampl e that illustrates this kind of dual y-axis mapping in c3.js, but am am not sure how to translate this example for use with the c3 package in R. I've been able to implement something like this with ggplot2 using the following MWE:
library(tidyverse)
# generate MWE data
data <- data.frame(a = abs(runif(20)),
date = seq(as.Date(Sys.Date()), by = "day", length.out = 20)) %>%
mutate(b = rev(a)*100)
# working ggplot2 implementation
data %>%
ggplot(aes(x = date)) +
geom_area(aes(y = b / 100), alpha = 0.2) +
geom_line(aes(y = a)) +
scale_y_continuous(name = 'a', sec.axis = sec_axis(~ . * 100, name = 'b'), limits = c(0, 1))
However, I'm struggling to recreate something similar using c3:
library(c3)
# non-working c3 attempt
data %>%
c3(x = 'date', y = 'a', y2 = 'b') %>%
c3_mixedGeom(types = list(a = 'line', b = 'area')) %>%
grid('y', show = T) %>%
xAxis(type = 'timeseries', tick = list(format = "%Y-%m-%d")) %>%
yAxis(min = 0, label = list(text = 'a')) %>%
y2Axis(show = T, label = list(text = 'b'))
Is this currently possible with c3? If so, where am I going wrong? Thanks!
My code: https://gist.github.com/ThoDuyNguyen/fe3545153b09d849614f23584b2dfcd0
I expect these 2 charts would fit perfectly to the panel. But you could see that only the first one is.
Hi,
I'm unable to find any function which can capture event_data just like plotly does for scatter plots (though it doesn't provide it for pie charts, maybe if you can then people would be using more of c3. You never know!).
So, basically I want to show which part/region of the pie I selected to show metadata about it into a datatable or something like that sort.
I would be really glad if you could provide me with some documentation because I checked most of the part online and couldn't find a better solution than asking the author directly.
Thanks and Regards,
Nimesh Sajjan Bumb
the legend label turns to '0' in pie/donut charts with only one category, see the sample code below.
data.frame(red=82) %>%
c3() %>%
c3_pie()
data.frame(red=82) %>%
c3() %>%
c3_donut()
The last date on the x-axis of my c3 chart is cut off.
Since space is tight I wish to re-align the date rather than create more space for the date to print.
Using Chrome Inspector I can manually adjust the text-anchor: middle
to text-anchor: end
and that seems to work.
However, I do not understand how to do this with css.
Here's my R Script and related css though I don't think that R is relevant to the issue here.
R Script
library(shiny)
library(c3)
data <- data.frame(a = abs(rnorm(20) * 10),
b = abs(rnorm(20) * 10),
date = seq(as.Date("2014-01-01"), by = "month", length.out = 20))
ui <- fluidPage(
includeCSS("c3.css"),
c3Output("chart", height = "100%")
)
server <- function(input, output, session) {
output$chart <- renderC3({
data %>%
c3(x = 'date') %>%
tickAxis('x', count = 5, format = '%Y-%m-%d')
})
}
shinyApp(ui, server)
css
.c3-line {
stroke-width: 4px !important;
}
.c3-axis-x-label {
text-anchor: end;
}
when a tibble is used witha defined x axis the check on the data type breaks
data <- tibble(a = abs(rnorm(20) * 10),
b = abs(rnorm(20) * 10),
date = seq(as.Date("2014-01-01"), by = "month", length.out = 20))
c3(data, x = 'date')
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.