Custom Display Javascript Format

Arcadia Data enables you to customize display format of fields in visuals using Javascript. The module includes checks for valid code.

In addition to the other categories, Arcadia Enterprise has a Custom Format option that enables a wide range of custom display configurations. The following steps outline how to use the Display Format: Custom Format interface.

  1. Click on the field you plan to modify, to open the Field Properties menu.
  2. Under Field Properties, click the Display Format option.

  3. In the Display Format interface, select Custom Javascript from the Category menu.

  4. In the Customize JS Format Function code entry box, enter valid JavaScript code.

    Click Save.

    display format in Custom mode

Specifying Text Color Based on Scalar Threshold

In the following example, we adapted the custom JS format to display more clearly indicate which US States list their Hispanic population above and or below the national average of 16%.

function myFunc(value) {
    // change display color based on value 
    // being below or above national average of 16%
    // expressed as percentage, with two decimal places
    if (value < .16) {
        // below 16% is blue
        return '<div style="color: blue">'+ Number(value * 100).toFixed(2) + '%' + '</div>';
    } else {
        // 16% is or higher is green
        return '<div style="color: green">' + Number(value * 100).toFixed(2) + '%'  +'</div>';

Compare the results in the % Hispanic column (uses Percentage Display and the Rel. to 16 National Average column, that uses custom Javascript code in this example.

display format in Custom mode