How do I display the output of a function of multiple qualtrics sliders in real time? - slider

My colleague and I am designing a survey using Qualtrics. On one page respondents must move a series of sliders.
We need to display the output of a function of the values of the sliders on the same page, ideally also in the form of another slider.
All of this must be done while the respondent moves the sliders.
Concretely, suppose the following:
value of slider 1 = 30;
value of slider 2 = 10;
value of slider 3 = 0
Output to be displayed = 30 x 20 + 10 x 5 + 0 x 15 = 650
where the 20, 5 and 15 are just arbitrary constants in the background.
If the user were to move slider 1 to 31, the displayed output should automatically update in real time to 670.
Any tip on how this is done? We're newbies to qualtrics and completely inexperienced with Java, so we'd be very grateful to anyone willing to provide us with working code. Thanks!

An update on my question, and a clarification after a comment received.
We were of course not asking for someone else to do our job. Just for a pointer in the right direction.
Based on an answer to a different question, I've managed to put this javascript together. It works, which is encouraging..
Code follows.
Qualtrics.SurveyEngine.addOnReady(function()
{
/*Place your JavaScript here to run when the page is fully displayed*/
var that=this.questionId;
jQuery("<p style='width:100%'><br><strong> Output <span id='OUT'>0</span></strong>").insertAfter("table.sliderGrid");
jQuery(document).on('change', function(){
var firstslider=parseInt(jQuery("[id='"+that+"~1~result']").val());
var secondslider=parseInt(jQuery("[id='"+that+"~2~result']").val());
var N=firstlider+secondslider*2;
jQuery("#OUT").text(N);
});

Related

#MPAndroidChart How to bypass empty data on StackedBar chart

I am a newbie of android developer and it’s 1st post on stackoverflow.
Thanks for your consideration for any inconvenience caused.
I am using MPAndroidChat for StackedBar Chart.
But StackedBar show empty thing on the some position which no entry data. I like to show only 7 data that I provide. Please refer to below screen shoot. It should be show 7 data on 2018/10/12,2018/10/11....2018/10/6, but it show empty chart many times.
Thanks!
Paddy
[detail]
The 7 BarEntry data as below
And I also follow below issue for timestamp label.
https://github.com/PhilJay/MPAndroidChart/issues/789
[issue screen shot]
screen shot
[BarEntry data]
float x=1050,float[] vals={6.0,5.3333335,6.0}
float x=2490,float[] vals={7.3333335,10.0,6.5}
float x=3930,float[] vals={8.5,7.3333335,8.0}
float x=5370,float[] vals={8.333333,7.6666665,7.8333335}
float x=6810,float[] vals={6.6666665,7.6666665,9.5}
float x=8250,float[] vals={8.833333,6.5,8.5}
float x=9690,float[] vals={8.666667,9.0,6.1666665}
So far I try to workaround by change x is increment by 1 day and use referenceTimestamp and IAxisValueFormatter to correct time by value*24*60*60*1000
code
`this.sdf = new SimpleDateFormat("yyyy/MM/dd");`
`return sdf.format(referenceTimestamp + value*24*60*60*1000);`
BTW, I ever try to add setGranularity(1f), setGranularityEnabled(true), it could hidden labels, but still show empty chart.

Looping a number count in Edge Animate

I am creating a banner in Adobe Edge Animate with a number count going from 0 to 1000, then slowly going to 1001... 1002... 1003... and then restarting/looping.
I have searched multiple online forums and I am using a code that I found in a previous post that works for the number count (see below), but I cannot get it to loop. Usually when I want to loop a banner I go to a specific time in the timeline and insert a trigger with
this.play (0);
This still loops the banner but not the loop count - it only displays the number 1000 until looping again. Any tips on how to go about this?
Here is link to my banner, when the flashing colors appear is when the banner is looping:
Banner
Here is the code I'm using:
var counter_delay = 0;
var max_count = 1000;
var present_count = 0;
var timer = window.setInterval(stepUp,counter_delay);
function stepUp(){
present_count++;
// Change the text of an element
sym.$("Text").html(present_count);
if(present_count==max_count)
clearInterval(timer);
}
The variables are not working like this. You have to set and get Variables in Edge.
On Composition Ready
sym.setVariable("variablename", 0);
Get Value
var myVariable = sym.getVariable("variablename");
Change Value and Set it again
myVariable++;
sym.setVariable("variablename", myVariable);
For your Loop i think you can use "onupdate" and just use: get variable, increase variable, set the Value for your Variable again.
Then, if your number is high enough, just set the variable to 0 again.

DimpleJS overrideMax, Dates and series drawing order

I have this interactive chart here. As its data change depending on selected time period I wish to set the date range from Nov-10 to Jul-14, no matter the data. I know that I must use overrideMax on x axis, but I can't make it to work. I guess it's a matter of date formatting. Every single combination I've tried gives the following as result.
What is the right formatting? Thanks a lot.
EDIT: Thank you very much on your quick response, John. Now it is working. I'm loving Dimple more and more!
I have another question regarding this chart. Is there any way to arrange drawing order of series? I would like 'Previsión' to be sent to back. Now it is drawn depending on time period.
EDIT 2: Based on this other question I think I figured out a solution. With a 50ms delay after the chart is drawn I simple erase the circles and paths I wish to be at the front and then append them to the chart svg object.
setTimeout(function () {
var datoCircles = svg.selectAll('circle[id*=Dato]:not([id*=futuro])');
var prevCircles = svg.selectAll('circle[id*=Prev]');
var prevPaths = svg.selectAll('path[class*=Prev]');
datoCircles.remove();
prevCircles.remove();
prevPaths.remove();
// Convertimos la seleción d3 a objetos jQuery
$(svg.selectAll('svg > g')[0])
.append($(prevPaths[0]))
.append($(prevCircles[0]))
.append($(datoCircles[0]));
}, 50);
They need to be set with JavaScript date objects, as native date parsing in JavaScript causes cross browser problems, I recommend using the d3 method:
x.overrideMax = d3.time.format("%Y-%m-%d").parse("2014-05-09");
With this approach you can use whichever date format suits you.

Target specific slide in Soliloquy slider with url

Does anyone have any experience with using a url to target a specific slide in a Soliloquy slider? I am using multiple sliders that I need to link to specific slides of from external pages/sites. The Soliloquy Docs provide this info (soliloquywp.com/docs/dynamically-set-the-starting-slide/) as closest to the solution but, for a php noob like me, the explanation is a bit terse and lacking, my fault, not theirs.
The example given in the docs seems to be a custom filter for a specific slide in a specific slider. I need to target slides in multiple sliders with urls. I guess I need help understanding the filter's function. I have commented out what I think each part does. Maybe someone could show me where I'm wrong?
//OP: I don't understand, what ids/slides are represented by the 10 and 2 values in these parameters. Where do I find these?
add_filter( 'soliloquy_pre_data', 'tgm_soliloquy_dynamic_starting_slide', 10, 2 );
function tgm_soliloquy_dynamic_starting_slide( $data, $slider_id ) {
// If the proper $_GET parameter is not set or is not the proper slider ID, do nothing.
//OP: Is the 'sol_slide' parameter for ALL soliloquy sliders in my site or is it the name in the Dashboard given when constructing the slider?
if ( empty( $_GET['sol_slide'] ) ) {
return $data;
}
// Change this if you want to target a specific slider ID, or remove altogether if you want this for all sliders.
//OP: I believe to target ALL sliders in my site I should comment this out. Right?
if ( 51064 !== $slider_id ) {
return $data;
}
// Set the slide number as a config property. Also preventing randomizing slides.
$data['config']['start'] = absint( $_GET['sol_slide'] );
$data['config']['random'] = 0;
// Optionally prevent autostarting the slider. Uncomment if you want that.
//$data['config']['auto'] = 0;
return $data;
}
Basically, I guess I am asking for a little help with implementing this filter to target any slide in any slider with a url. Slim odds, but I'm dead in the water! Big thanks to anyone who can shed some light on this for me.
Complete, correctly functioning answer is here provided the plugin author, of course, duh: http://soliloquywp.com/support/topic/a-way-to-link-directly-to-a-specific-slide/
The value "sol_slide" is generic to any slider created with the plugin. Just put the custom filter provided in the example into your, hopefully, child-theme's functions.php, and construct your urls targeting specific slides like so: http://mywebsite.com/specific-product-page-with-slider/?sol_slide=3. Slide numbering is based on zero so 1 = 2 etc. Works like a charm.

pChart Bar Charts set color depending on threshold

Good Day To All
I'm new to pCharts, works great!
I'm trying to create a bar chart with 2 thresholds and display different bar colors. Setting the thresholds is done and works well. Now I would like to set the standard palette to a set color and only the bars that exceed the specified second threshold should be a different color.
My data consists of times file were imported
So in theory, if possible, all bars exceeding the 2nd limit should be red or pink or whatever.
Is this possible? If so, where do I start fiddling?
I have tried OverideColors with an if statement but it seems not to work so well.
Any info would be very helpful.
Thanks
Ok, so here is the code. I know there might be better or cleaner ways of doing it but this works:
/*Palette per Bar*/
$thold = strtotime("09:30:00");
foreach ($lastdate as $over) {
if ($over < $thold) {
$color = array("R"=>0,"G"=>204,"B"=>204);
$Palette[] = $color;
}
else {
$color2 = array("R"=>224,"G"=>46,"B"=>117);
$Palette[] = $color2;
}
}
Hope this helps