How can I save the final value of a slider to an embedded data field?

Hi all,

I have the following javascript to display an adjustable (via sliders) chart below. I'm trying to capture the final slider value of the red variable.

However, no matter where I put "Qualtrics.SurveyEngine.setEmbeddedData("R_LR_HR_10_50adjusted", finalposition)" it just saves the original position, or nothing at all in the output csv.

Any help would be very much appreciated!

Best,
Chris

Qualtrics.SurveyEngine.addOnload(function()
{

Chart.defaults.global = {
animation: true,
animationSteps: 60,
animationEasing: "easeOutQuart",
showScale: true,
scaleOverride: false,
scaleSteps: null,
scaleStepWidth: null,
scaleStartValue: null,
scaleLineColor: "rgba(0,0,0,.1)",
scaleLineWidth: 1,
scaleShowLabels: true,
scaleLabel: "<%=value%>",
scaleIntegersOnly: true,
scaleBeginAtZero: false,
scaleFontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
scaleFontSize: 12,
scaleFontStyle: "normal",
scaleFontColor: "#666",
responsive: false,
maintainAspectRatio: true,
showTooltips: true,
customTooltips: false,
tooltipEvents: ["mousemove", "touchstart", "touchmove"],
tooltipFillColor: "rgba(0,0,0,0.8)",
tooltipFontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
tooltipFontSize: 14,
tooltipFontStyle: "normal",
tooltipFontColor: "#fff",
tooltipTitleFontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
tooltipTitleFontSize: 14,
tooltipTitleFontStyle: "bold",
tooltipTitleFontColor: "#fff",
tooltipYPadding: 6,
tooltipXPadding: 6,
tooltipCaretSize: 8,
tooltipCornerRadius: 6,
tooltipXOffset: 10,
tooltipTemplate: "<%if (label){%><%=label%>: <%}%><%= value %> %",
multiTooltipTemplate: "<%= value %>",
onAnimationProgress: function() {},
onAnimationComplete: function() {}
}
Chart.defaults.global.responsive = false;
Chart.types.Doughnut.extend({
name: "DoughnutTextInside",
showTooltip: function() {
this.chart.ctx.save();
Chart.types.Doughnut.prototype.showTooltip.apply(this, arguments);
this.chart.ctx.restore();
},
draw: function() {
Chart.types.Doughnut.prototype.draw.apply(this, arguments);

var width = this.chart.width,
height = this.chart.height;

var fontSize = (height / 140).toFixed(2);
this.chart.ctx.font = fontSize + "em Verdana";
this.chart.ctx.textBaseline = "middle";

var red = jQuery("#red").slider("value"),
blue = jQuery("#blue").slider("value");
var total = (red + blue)
var text = (red + blue + "%");
var textX = Math.round((width - this.chart.ctx.measureText(text).width) / 2);
var textY = height / 2;
if (total == 100) {
this.chart.ctx.fillStyle = '#00ff00',
jQuery("#NextButton").show();
}else{
this.chart.ctx.fillStyle = '#ff0000',
jQuery("#NextButton").hide();
}
this.chart.ctx.fillText(text, textX, textY);
}
});

var data = [{
value: 30,
color: "#729fcf",
highlight: "#5AD3D1",
label: "Global Bonds Funds"
}, {
value: 70,
color: "#F7464A",
highlight: "#FF5A5E",
label: "Global Stocks Funds"
}]

function hexFromRGB(r, g, b) {
var hex = [
r.toString(16),
g.toString(16),
b.toString(16)
];
jQuery.each(hex, function(nr, val) {
if (val.length === 1) {
hex[nr] = "0" + val;
}
});
return hex.join("").toUpperCase();
}

function refreshSwatch() {
var red = jQuery("#red").slider("option", "value"),
blue = jQuery("#blue").slider("option", "value");
if (red < 2) {
jQuery("#red").slider("option", "value", 2);
return false;
}
if (blue < 2) {
jQuery("#blue").slider("option", "value", 2);
return false;
}
myDoughnutChart.segments[0].value = blue;
myDoughnutChart.segments[1].value = red;
myDoughnutChart.update();
}
jQuery(function() {
jQuery("#red").slider({
orientation: "horizontal",
range: "min",
min: 0,
max: 100,
value: 70,
slide: refreshSwatch,
change: refreshSwatch
});
});
jQuery(function() {
jQuery("#blue").slider({
orientation: "horizontal",
range: "min",
min: 0,
max: 100,
value: 30,
slide: refreshSwatch,
change: refreshSwatch
});
});

var ctx = jQuery("#myChart").get(0).getContext("2d");
var myDoughnutChart = new Chart(ctx).DoughnutTextInside(data, {
responsive: false
});
jQuery(document).on('change',function(){
var finalposition=parseInt(jQuery("#red").slider("option", "value"));
});

Qualtrics.SurveyEngine.setEmbeddedData("R_LR_HR_10_50adjusted", finalposition)
});