Extension JS API arcapi functions

The extension JS module has access to an arcapi object. Arcadia Data supports the following functions fully:

Table 1. arcapi Functions
Function Description
arcapi.addScripts() Adds script elements.
arcapi.addStyles() Adds style elements.
arcapi.chartId() Returns the id DOM element.
arcapi.dataResult() Returns the data result object and gives access to the raw data for plotting the visual.
arcapi.getParameters() Returns information on all current parameters.
arcapi.getSetting() Returns the value of the specified setting.
arcapi.sendParameters() Forwards parameter definitions to other visuals in the app.
arcapi.settings() Returns information on all current settings.

arcapi.addScripts(filepaths, callback)

Adds script elements for the additional styles specified in the filepaths array. The function callback is invoked after load completes.

Syntax
arcapi.addScripts(
  filepaths, 
  callback);
Parameters
  • filepaths An array that specifies the additional JS files to load.
  • callback Call-back function that is invoked after the load is completed.
Examples

In program code, you can use this API in the following manner:

arcapi.addScripts(
  ['https://cdnjs.cloudflare.com/ajax/libs/highcharts/7.0.1/highcharts.js'], 
  function() {
    console.log('highcharts.js has been loaded');
    }
  );

This code embeds the following <script> as the last element of the <head> tag in the HTML file:

<script 
  type="text/javascript" 
  src="https://cdnjs.cloudflare.com/ajax/libs/highcharts/7.0.1/highcharts.js" 
  data-loaded="true">
</script>

arcapi.addStyles(filepaths, callback)

Adds style elements for the additional styles specified in the filepaths array. The function callback is invoked after load completes.

Syntax
arcapi.addStyles(
  filepaths, 
  callback);
Parameters
  • filepaths An array that specifies the additional CSS files to load.
  • callback Callback function that is invoked after the load is completed.
Examples

In program code, you can use this API in the following manner:

arcapi.addStyles(
  ['https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.2.1/css/bootstrap.css'],
  function() {
    console.log('Twitter Bootstrap has been loaded');
    }
  );

This code embeds the following <link> as the last element of the <head> tag in the HTML file:

<link 
  type="text/css" 
  rel="stylesheet" 
  href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.2.1/css/bootstrap.css" 
  data-loaded="true"
>

arcapi.chartId()

Returns the id attribute of the DOM element used to draw the visual.

Syntax
arcapi.chartId();
Usage
$("#" + arcapi.chartId())
Returns
A jquery selector to the DOM element.

arcapi.dataResult()

Returns the dataResult object that gives the extension access to the raw data used to plot the visual. This object supports the arc.data.result interface.

Syntax
arcapi.dataResult();

This example shows the result of the arcapi.dataResult() call:

f (){return"arc.data.result"}

arcapi.getParameters()

Returns a hash object that contains key-value mappings for all current parameters. The key is the parameter name.

Syntax
arcapi.getParameters();
Example

The following is a typical result of the arcapi.getParameters() command:

{
  "productCategory": "Analytics", 
  "year": "2019", 
  "companies.data": "'Apple', 'Google', 'Arcadia'", 
  "companies.exclude": "in"
}
See Also
arcapi.sendParameters(params_hash)

arcapi.getSetting(settingName)

Returns the value of the specified setting of the current JS extension.

Syntax
arcapi.getSetting(settingName);
Parameters
  • settingName Name of setting.
Example

The following command retrieves the "Color" setting:

arcapi.getSetting("Color");

Our example's result follows:

"red"
See Also
arcapi.settings()

arcapi.sendParameters(params_hash)

Accepts a hash definition, and sends out the keys and values of the hash as parameters to other visuals in the app.

Syntax
arcapi.sendParameters(params_hash);
Parameters
  • params_hash Hash definition.
Example

To pass a parameter with name 'company' and value 'Arcadia Data' to all visuals and filters in the dashboard, issue the following command:

arcapi.sendParameters({"company": "'Arcadia Data'"});
See Also
arcapi.getParameters()

arcapi.settings()

Returns information on all current settings for the custom style: an array of objects, with id of a setting, and value of that setting.

The JS extension's settings() function specifies the order of the array.

Syntax
arcapi.settings();
Example

A typical example output after running the arcapi.settings() function looks similar to this:

 [
    {
      id: "Column Name",
      value: "",
    },
    {
      id: "Max bar width",
      defaultValue: "50",
      value: "50",
    },
    {
      id: "Color",
      defaultValue: "steelblue",
      value: "red",
    }
  ];