Приложение
При запуске генерируется таблица 3 x 3 со значениями от 1 до 9 в случайном порядке.Пользователь приложения может видеть пустые 3 x 3 rhandsontable
, которые он / она будет использовать, чтобы попытаться угадать, где находятся сгенерированные значения.Когда пользователь нажимает кнопку «Отправить», ячейки с правильными значениями становятся зелеными, а все остальные ячейки остаются такими, как есть.
Моя проблема
Ячейки, в которых пользователь угадалне зеленеть, когда пользователь нажимает кнопку.Другими словами, условное форматирование не работает, хотя я и раньше заставлял его работать (это было в первой версии приложения, когда я не использовал блестящие модули).
Что я сделал
Полный проект находится в следующем репозитории Github, который потенциальные пользователи могут захотеть клонировать вместо копирования и вставки приведенного ниже кода: https://github.com/gueyenono/number_game
В папке моего проекта 4 файла.Первые два файла - это обычные ui.R
и server.R
, которые по сути называют блестящими модулями (то есть hot_module_ui()
и hot_module()
).Модули содержатся в файле global.R
.Последний файл, update_hot.R
, содержит функцию, используемую в модулях.
ui.R
Этот файл загружает необходимые пакеты, предоставляет название для приложения и вызывает hot_module_ui()
.Модуль просто отображает пустой 3 x 3 rhandsontable
и actionButton()
.
library(shiny)
library(rhandsontable)
source("R/update_hot.R")
ui <- fluidPage(
titlePanel("The number game"),
mainPanel(
hot_module_ui("table1")
)
)
server.R
Этот файл вызывает hot_module()
, который содержит код дляусловное форматирование.
server <- function(input, output, session) {
callModule(module = hot_module, id = "table1")
}
update_hot.R
Эта функция вызывается при вызове кнопки «Отправить».Функция имеет два аргумента:
hot
: handsontable в приложении x
: значения, сгенерированные при запуске
Эточто делает функция (полный код файла находится в конце этого раздела):
- Получить пользовательские данные
user_input <- hot_to_r(hot)
Сравните пользовательские данные (
user_input
) с истинными значениями (
x
) и сохраните индексы строк и столбцов ячеек, в которых пользователь угадал право
i <- which(user_input == x, arr.ind = TRUE)
row_correct <- i[, 1] - 1
col_correct <- i[, 2] - 1
Обновите текущий объект handsftable с помощью индексов строк и столбцов и используйте аргумент
renderer
функции
hot_cols()
, чтобы сделать фон соответствующих ячеек зеленым.Обратите внимание, что я использую функцию
hot_table()
для обновления существующего объекта
rhandsontable
.
hot %>%
hot_table(contextMenu = FALSE, row_correct = row_correct, col_correct = col_correct) %>%
hot_cols(renderer = "function(instance, td, row, col, prop, value, cellProperties){
Handsontable.renderers.TextRenderer.apply(this, arguments);
if(instance.params){
// Correct cell values
row_correct = instance.params.row_correct
row_correct = row_correct instanceof Array ? row_correct : [row_correct]
col_correct = instance.params.col_correct
col_correct = col_correct instanceof Array ? col_correct : [col_correct]
for(i = 0; i < col_correct.length; i++){
if (col_correct[i] == col && row_correct[i] == row) {
td.style.background = 'green';
}
}
return td;
}")
Вот полный код для update_hot.R
update_hot <- function(hot, x){
# Get user inputs (when the submit button is clicked)
user_input <- hot_to_r(hot)
# Get indices of correct user inputs
i <- which(user_input == x, arr.ind = TRUE)
row_correct <- i[, 1] - 1
col_correct <- i[, 2] - 1
# Update the hot object with row_index and col_index for user in the renderer
hot %>%
hot_table(contextMenu = FALSE, row_correct = row_correct, col_correct = col_correct) %>%
hot_cols(renderer = "function(instance, td, row, col, prop, value, cellProperties){
Handsontable.renderers.TextRenderer.apply(this, arguments);
if(instance.params){
// Correct cell values
row_correct = instance.params.row_correct
row_correct = row_correct instanceof Array ? row_correct : [row_correct]
col_correct = instance.params.col_correct
col_correct = col_correct instanceof Array ? col_correct : [col_correct]
for(i = 0; i < col_correct.length; i++){
if (col_correct[i] == col && row_correct[i] == row) {
td.style.background = 'green';
}
}
return td;
}")
}
global.R
Это файл, который содержит блестящие модули.Модуль пользовательского интерфейса (hot_module_ui()
) имеет: - rHandsontableOutput
- actionButton
- я добавил tableOutput
, чтобы увидеть, где находятся сгенерированные значения (полезно для тестирования кода)
серверный модуль (hot_module()
) вызывает функцию update_hot()
и пытается обновить handsontable в приложении всякий раз, когда пользователь нажимает кнопку «Отправить».Я попытался достичь этого, используя observeEvent
и реактивное значение react$hot_display
.При запуске react$hot_display
содержит фрейм данных 3 x 3 NA
с.Когда кнопка нажата, она обновляется новой версией handsontable (содержащей пользовательские данные и условное форматирование).Вот полный код для global.R
:
hot_module_ui <- function(id){
ns <- NS(id)
tagList(
rHandsontableOutput(outputId = ns("grid")),
br(),
actionButton(inputId = ns("submit"), label = "Submit"),
br(),
tableOutput(outputId = ns("df"))
)
}
hot_module <- function(input, output, session){
values <- as.data.frame(matrix(sample(9), nrow = 3))
react <- reactiveValues()
observe({
na_df <- values
na_df[] <- as.integer(NA)
react$hot_display <- rhandsontable(na_df, rowHeaders = NULL, colHeaders = NULL)
})
observeEvent(input$submit, {
react$hot_display <- update_hot(hot = input$grid, x = values)
})
output$grid <- renderRHandsontable({
react$hot_display
})
output$df <- renderTable({
values
})
}
Как уже упоминалось в начале, условное форматирование не работает при нажатии кнопки «Отправить», и я не уверен, почему.Еще раз, вы можете получить доступ к полному коду в следующем репозитории Github:
https://github.com/gueyenono/number_game