RTMP video stream player

Chart style

The RTMP Video Stream Player is a media widget. You can customize the URL and type of a video, which lets you add a video player to your visualization application. The RTMP Video Stream Player widget supports only video streams that use the RTMP protocol.

Configuration panel

• Search for Configurations: In the right-side panel of Canvas Editor, click the Settings tab, and click Search for Configurations in the upper-right corner. Enter the required configuration item in the search box, and click the search icon to quickly locate the configuration item. Fuzzy match is supported. For more information, see Search for Configurations.
• Size: indicates the size of a widget, including its pixel width and height. You can click the icon to proportionally adjust the width and height of a widget. After you click this icon again, you can adjust the width and height as needed.
• Position: the position of a widget, which is indicated by pixel X and Y coordinates. X-coordinate indicates the pixel distance between the upper-left corner of the widget and the left border of the canvas. Y-coordinate indicates the pixel distance between the upper-left corner of the widget and the upper border of the canvas.
• Rotation Angle: the angle of a rotation that uses the center point of a widget as the rotation point. The unit is degrees (°). You can use one of the following methods to control the rotation angle of a widget:
  • Directly enter the degrees in the Rotation Angle spin box or click the plus sign (+) or minus sign (-) to increase or decrease the value in the Rotation Angle spin box.
  • Drag the black dot in the icon.
  • Click the icon to horizontally flip a widget.
  • Click the icon to vertically flip a widget.
• Opacity: the opacity of a widget. Valid values: 0 and 1. If this parameter is set to 0, the widget is hidden. If this parameter is set to 1, the widget is completely displayed. Default value: 1.

• Video stream address: The URL of the video stream.

  Important

  • Only video streams that use the RTMP protocol are supported.

  • You can configure the video stream address and type on both the Configuration panel and the Data panel. DataV prioritizes the configuration on the Data panel.

• Video stream type: Sets the format of the video stream. The options are rtmp/mp4 and rtmp/flv.

• Mute: If you turn on this switch, the video is muted on the preview or published page. If you turn off this switch, the video plays with sound.

Data Panel (default mode)

Field description

Table 1. Parameters

Parameter	Description
Controlled Mode	If you turn on the switch, data is not requested when a widget is initialized. Data requests are triggered only based on callback IDs or the method configured in Blueprint Editor. If you turn off the switch, data requests are automatically triggered. By default, the switch is turned off.
Auto Data Request	After you select the Auto Data Request check box, you can enable dynamic polling, and manually specify the polling interval. If you do not select this check box, data is not automatically requested. You must manually refresh the page to request data or use Blueprint Editor or callback ID events to trigger data requests.
Data Source	In the right-side panel of Canvas Editor, click the Data tab. Click Set next to Static Data. In the Configure Datasource panel, select a data source from the Data Source Type drop-down list. Enter code for data query in the code editor, click Preview Data Response to preview the response of the data source, and then view the response. For more information, see Configure asset data.
Data Filter	If you select the Data Filter check box, you can convert the data structure, filter data, and perform simple calculations. If you click the plus sign (+) next to Add Filter, you can configure the script for the data filter in the editor that appears. For more information, see Use the data filter.
Data Response Result	The response to a data request. If the data source changes, you can click the icon next to Data Response Result to view the data response in real time.

Data panel (analysis mode)

For more information about the data panel in BI analysis mode, see BI analysis mode data panel.

Field description

If a component was added in analysis mode, you can click Default Mode in the upper-right corner of the data panel. In the dialog box that appears, confirm that you want to exit analysis mode and delete the analyzer associated with the BI analysis component. After you exit analysis mode, the component data panel switches back to default mode.

Interaction panel

This widget has no interaction events.

Blueprint Editor interaction configuration

1. In Canvas Editor, right-click a widget in the Layer panel and select Add to Blueprint Editor.
2. Click the icon in the upper-left corner of the page.

3. On the Blueprint Editor configuration page, click the RTMP video stream player widget in the Import Nodes section. The configuration parameters for the widget are displayed on the canvas.

   • Events

     Event	Description
     When the Data Interface Request Completes	This event is triggered when the data API request is successful and the data is processed by the filter. The event carries the processed data in JSON format. For a data example, see the Data Response section on the Data tab of the widget configuration panel in the canvas editor.
     When data API request fails	This event is triggered when the data API request fails due to a network issue or an API error. The event carries the processed data in JSON format. For a data example, see the Data Response section on the Data tab of the widget configuration panel in the canvas editor.

   • Actions

     Action	Description
     Request Data API	Re-requests data from the server. Data from an input data processing node or a layer node is used as a parameter. For example, if the RTMP video stream player is configured with an API data source of https://api.test and the data passed to the Request Data API action is { id: '1'}, the final requested API is https://api.test?id=1.
     Import Data	After you process the data into the component's drawing format, you can import and redraw the component without requesting data from the server again. For a data example, see the Data Response area on the Data tab in the configuration panel on the right side of the canvas editor.
     Update Widget Configuration	Dynamically updates the style configuration of the widget. First, on the Configuration panel of the widget, click Copy Configuration to Clipboard to get the widget configuration data. Then, change the field values for the corresponding styles in a data processing node on the Blueprint Editor configuration page as needed.
     Show	Shows the widget. The following code provides a data example. return { "animationType": "", "animationDuration": 1000, "animationEasing": "linear" };
     Hide	Hides the widget. The following code provides a data example. return { "animationType": "", "animationDuration": 1000, "animationEasing": "linear" };
     Toggle Visibility	Toggles the visibility of the widget. The following code provides a data example. return { "animationIn": { "animationType": "", "animationDuration": 1000, "animationEasing": "linear" }, "animationOut": { "animationType": "", "animationDuration": 1000, "animationEasing": "linear" } };
     Move	Moves the widget to a specified position. The following code provides a data example. return { // Move mode. 'to' for absolute positioning, 'by' for relative positioning. Default: 'to'. "positionType": "to", // Target position. x and y coordinates. "attr": { "x": 0, "y": 0 }, // Animation settings. "animation": { "enable": false, // Animation duration. "animationDuration": 1000, // Animation curve. Options: linear, easeInOutQuad, or easeInOutExpo. "animationEasing": "linear" } };