Print variable in a CDE dashboard using html or javascript

Question

I have a dashboard with a popup slicer, but once I close the popup there is no way to tell which variables were selected, so I would like to display, above the chart, in a row, a path kind of line including all parameters I'm selecting in the slicer box.

I tried referencing them in a HTML layout position, like: ${size}, ${type}, ${line} and ${service}, but it shows the text as written. No variables are parsed.

I also created a freeform component to use Javascript, but I see no data, and I can't figure out the function to use.

Answer 1

One of the more standard ways of doing that is by using a Text Component. In the expression field, you can use something like this:

function() {
  return "My Parameter: " + Dashboards.getParameterValue("myParam");
}

where myParam is the name of your parameter. You'll also want to add myParam to the listeners, so as to keep the text component in sync with the parameter.

The Freeform component would be a possibility as well, but it really is Free Form, you have to do everything yourself. We added that simply so we'd have an easy way to add arbitrary code to the CDF lifecycle. Using a Freeform Component you'd end up doing something like this in the Custom Chart Script (does it show we reused that property name from a chart?):

function() {

  $("#" + this.htmlObject).text("My parameter: " + Dashboards.getParameterValue("my Param"));
}