问题描述
我有一个自定义的闪亮输入,它是一组balanceSliders。我试图让用户将这些滑块之一“锁定”在适当的位置,以便您可以更好地设置其他两个滑块。我比R更熟悉R。因此,我不确定要执行什么逻辑才能使其中一个保持移动,同时仍然允许其他两个在两者之间自由移动,那么我不确定。我尝试使用Shinyjs软件包shinyjs::disable("test1"
,但这没用,也不确定在我的watchEvent中放入什么。即使确实禁用了滑块,我也不确定js文件在运行时是否会更新该数量。这是我的问题的一个完整的例子。很高兴回答任何问题。
发光的应用
### Shiny Inputs
library(shiny)
balancedSliderInput <- function(inputId,value = 0,label = "",group = "",width = "100%") {
if (label != "")
label <- paste0('<label class="control-label" for="',inputId,'">',label,'</label>')
balanced_slider_tag <- tagList(
div(style = paste("width: ",width),class = "all-balanced-slider",HTML(label),div(id = inputId,class = paste("balanced-slider",group),as.character(value)),span(class = "value","0"),HTML("%")
)
)
dep <- list(
htmltools::htmlDependency("balanced_slider","0.0.2",c(file = "www"),script = c("js/jquery-ui.min.js","js/balancedSlider.js"),stylesheet = c("css/jquery-ui.min.css")
)
)
htmltools::attachDependencies(balanced_slider_tag,dep)
}
updateBalancedSliderInput <- function(session,value = 0) {
message <- list(value = value)
session$sendinputMessage(inputId,message)
}
registerInputHandler("balancedSlider",function(data,...) {
if (is.null(data))
NULL
else
data
},force = TRUE)
########## App ------
ui <- fixedPage(
#actionButton("reset","Reset",icon = icon("undo-alt")),actionButton("lock1","Lock Test1"),actionButton("lock2","Lock Test2"),balancedSliderInput("test1",label = "Test1",value = 33),balancedSliderInput("test2",label = "Test2",balancedSliderInput("test3",textoutput("test")
)
server <- function(session,input,output) {
test_reactive <- reactive({
return(input$test1)
})
output$test <- renderText({
test <- paste("Sluder 1 is at",test_reactive()[[1]])
return(test)
})
observeEvent(input$lock1,{
#### WHAT SHOULD GO HERE?? The below doesn't work.
shinyjs::disable("test1")
})
}
shinyApp(ui,server)
JAVASCRIPT
$(function() {
$('.balanced-slider').each(function() {
console.log("Running Log 1")
var init_value = parseInt($(this).text());
$(this).siblings('.value').text(init_value);
$(this).empty().slider({
value: init_value,min: 0,max: 100,range: "max",step: 0.5,animate: 0,slide: function(event,ui) {
// Update display to current value
$(this).siblings('.value').text(ui.value);
// Get current total
var total = ui.value;
var sibling_count = 0;
var classes = $(this).attr("class").split(/\s+/);
var selector = ' .' + classes.join('.');
//console.log(selector);
var others = $(selector).not(this);
others.each(function() {
total += $(this).slider("option","value");
sibling_count += 1;
});
//console.log(total);
var delta = total - 100;
var remainder = 0;
// Update each slider
others.each(function() {
console.log("Running Log 2")
var t = $(this);
var current_value = t.slider("option","value");
var new_value = current_value - delta / sibling_count;
if (new_value < 0) {
remainder += new_value;
new_value = 0;
}
t.siblings('.value').text(new_value.toFixed(1));
t.slider('value',new_value);
});
if(remainder) {
var pos_val_count = 0;
others.each(function() {
if($(this).slider("option","value") > 0)
pos_val_count += 1;
});
others.each(function() {
if($(this).slider("option","value") > 0) {
var t = $(this);
var current_value = t.slider("option","value");
var new_value = current_value + remainder / pos_val_count;
t.siblings('.value').text(new_value.toFixed(1));
t.slider('value',new_value);
}
});
}
},// fire the callback event for the other sliders
stop: function(event,ui) {
var classes = $(this).attr("class").split(/\s+/);
var selector = '.' + classes.join('.');
$(selector).not(this).each(function() {
$(this).trigger("slidestop");
});
}
});
});
});
var balancedSliderBinding = new Shiny.InputBinding();
$.extend(balancedSliderBinding,{
find: function(scope) {
return $(scope).find(".balanced-slider");
},// The input rate limiting policy
getRatePolicy: function() {
console.log("Log 8")
return {
// Can be 'debounce' or 'throttle'
policy: 'debounce',delay: 500
};
},getType: function() {
return "balancedSlider";
},getValue: function(el) {
console.log("Running Log 3")
var obj = {};
obj[$(el).attr("id")] = $(el).slider("option","value");
return obj;
},setValue: function(el,new_value) {
console.log("Running Log 4")
$(el).slider('value',new_value);
$(el).siblings('.value').text(new_value);
},subscribe: function(el,callback) {
console.log("Log 6")
$(el).on("slidestop.balancedSliderBinding",function(e) {
callback(); // add true parameter to enable rate policy
});
},unsubscribe: function(el) {
console.log("Log 7")
$(el).off(".balancedSliderBinding");
},// Receive messages from the server.
// Messages sent by updateUrlinput() are received by this function.
receiveMessage: function(el,data) {
console.log("Running Log 5")
if (data.hasOwnProperty('value'))
this.setValue(el,data.value);
$(el).trigger('change');
},});
Shiny.inputBindings.register(balancedSliderBinding,"balancedSliderBinding");
// Testing
$(document).ready(function() {
$(`#reset_drive`).on(`click`,function() {
//$(`#bike_share`).getValue()
//$(`#car_share`).getValue()
//$(`#carpool_share`).getValue()
});
})
可能的JavaScript更改
slide: function(event,ui) {
// Update display to current value
$(this).siblings('.value').text(ui.value);
// Get current total
var total = ui.value;
var sibling_count = 0;
var locked_count = 0;
var classes = $(this).attr("class").split(/\s+/);
var selector = ' .' + classes.join('.');
//console.log(selector);
var others = $(selector).not(this);
others.each(function() {
total += $(this).slider("option","value");
sibling_count += 1;
// How can I select a "Locked Slider?"
if ($(this)) {
locked_count += 1
}
});
//console.log(total);
var delta = total - 100;
var remainder = 0;
// Update each slider
others.each(function() {
// If this is not locked...
if ($(this)) {
var t = $(this);
var current_value = t.slider("option","value");
var unlocked_siblings = sibling_count - locked_count
var new_value = current_value - delta / unlocked_siblings;
if (new_value < 0) {
remainder += new_value;
new_value = 0;
}
t.siblings('.value').text(new_value.toFixed(1));
t.slider('value',new_value);
}
});
if (remainder) {
var pos_val_count = 0;
others.each(function() {
if($(this).slider("option",List item
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)