Manage Page Parameters


In a DTV single-page application, navigators automatically produce a set of parameters that drive widget interactions. In practice, however, navigator parameters are often not the right format or granularity for your needs. For example:

  • The time navigator produces a full timestamp, but a chart title only needs the year.

  • A new value needs to be derived by combining multiple navigator parameters.


Custom parameters are designed for exactly these cases. Using a JavaScript script, you can transform existing navigator parameters into the values your page actually needs.

At runtime, Global parameters = Navigator parameters + Custom parameters. Both types are available for widget linkage, calculated fields, title references, and more.

Open Parameter Panel


In the single-page application editor, click Others → Parameters in the top-right corner to open the Parameter Panel.

The panel lists all navigator parameters and any custom parameters already configured for the page.


single-page

Add Custom Parameters


Click Edit Custom Parameters in the panel and complete the following steps:

1. Define Parameter Information


Click Add Custom Parameter on the right side of the pop-up and fill in the following information:

Field

Description

Parameter Name

Display name shown in the panel. Supports internationalization.

ID

The _DT_ prefix is added automatically. Must start with a letter; only letters, digits, and underscores are allowed. Must be unique in this page.

Parameter Example

A sample value to help others understand the expected format.

Description

Explains the purpose of the parameter.

2. Write Script


The script is a JavaScript function that takes the navigator parameters as input and calculates the values ​​of custom parameters. It runs automatically whenever navigator parameters change, updating the custom parameter values.


The following built-in variables are available:

Variable

Description

global

A JS object containing all navigator parameters, e.g. global.startTime, global.htmlmId.

locale

The current language, e.g. zh-CN, en-US.

log

Console log output, same usage as console.log. For debugging.

The script must end with a return statement that returns a JS object whose keys are the full custom parameter IDs (including the _DT_ prefix).

Note

Keys in the return object must include the _DT_ prefix and match the parameter ID exactly, otherwise the parameter will not receive its value.


Example: The time navigator produces startTime/endTime in YYYY-MM-DD HH:mm:ss format. To extract just the year:

var startYear = null;
var endYear = null;

if (global.startTime) {
  startYear = new Date(global.startTime).getFullYear();
}
if (global.endTime) {
  endYear = new Date(global.endTime).getFullYear();
}

return {
  _DT_startYear: startYear,
  _DT_endYear: endYear
};

3. Debug Script


Use log or console.log to print intermediate values to the browser developer console and verify your script logic. If log output does not appear, enable debug mode by running the following command in the browser console and then refreshing the page:

localStorage.setItem("dtv_debug", "true")

Edit and Delete Custom Parameters


Click Edit Custom Parameters in the panel, locate the parameter in the list, and click its inline edit or delete icon.

  • Edit: Modify the name, ID, parameter example, description, or script logic.

  • Delete: Remove parameters that are no longer needed.

Navigator parameters cannot be edited or deleted.

Use Parameters


Once configured, custom parameters and navigator parameters are available in the following contexts:

Context

How to use

Reference

Widget navigator linkage

When configuring linkage between a widget and a navigator, select the target parameter from the parameter list.

Adding Linkage Between Widget and Navigator

Calculated fields

When creating or editing a calculated field in widget data configuration, select the parameter from the parameter list.

Adding Data Fields

Widget title

When configuring a widget title, select Dynamic and reference the parameter using ${parameterID}.

Title Format

Title link URL

When configuring a title interaction, set Actions to Click Title to Jump, Redirection Method to URL, and reference the parameter in URL using ${parameterID}.

Title Interaction