Embedded Report Properties and Objects

This applies to: Visual Data Discovery

Properties can be passed as parameters to the createComponent method when embedding Symphony reports.

Here is a sample embedding "componentInstanceId":"<id>":

embedManager.createComponent('report',
	const componentConfig = {
		"reportId": "<report-ID>",
		"componentInstanceId":"<component-instance-ID>",
	}
);

The following table describes available options for these properties and objects.

Property/Object	Default	Description
"reportId":"<report-ID>"	none	The report ID. If no report ID is specified, an empty report is embedded. Type: string
"componentInstanceId":"<component-instance-ID>"	none	The instance ID for the report is generated when the report is created. Type: string

Here is a sample embedding "type":

embedManager.createComponent('report',
	const componentConfig = {
		"reportId": "<report-ID>",
		"componentInstanceId":"<component-instance-ID>",
		"type":"report",	
	}
);

The following table describes available options for these properties and objects.

Property/Object	Default	Description
"type":"report"		The type of embedded Composer component.

Here is a sample embedding "application":

embedManager.createComponent('report',
	const componentConfig = {
		"reportId": "<report-ID>",
		"componentInstanceId":"<component-instance-ID>",
		"type":"report",
		"application":{
			"banner":false,
			"logo":true
		}
	}
);

The following table describes available options for these properties and objects.

Property/Object	Default	Description
"application.banner": true	false	Indicates whether the Symphony top-level navigation banner should be shown with the embedded report. Valid values are true or false. Type: boolean This property is deprecated and will be removed in a future release.
"application.logo": true	false	Indicates whether the Symphony logo should be shown with the embedded report. Valid values are true or false. Type: boolean This property is deprecated and will be removed in a future release.

Here is a sample embedding "interactivityProfileName":

embedManager.createComponent('report',
	const componentConfig = {
		"reportId": "<report-ID>",
		"componentInstanceId":"<component-instance-ID>",
		"type":"report",
		"application":{
			"banner":false,
			"logo":true
		}
		"interactivityProfileName":"interactive",
	}
);

The following table describes available options for these properties and objects.

Property/Object	Default	Description
"interactivityProfileName" :"interactive"	interactive	Determines the way in which your users will be able to work with the embedded report. Valid values are readonly and interactive. If you do not want the user of your application to change anything and only be able to view the report, specify readonly. If you want your users to be able to make changes to the report, specify interactive. When the mode is readonly, the report cannot be changed. This setting is backward-compatible with the interactive option for public shared link embeds. If you are migrating to Symphony's JavaScript embed technology, specify interactive for this setting to ease the migration. Type: string

Here is a sample embedding "interactivityOverrides":

embedManager.createComponent('report',
	const componentConfig = {
		"reportId": "<report-ID>",
		"componentInstanceId":"<component-instance-ID>",
		"type":"report",
		"application":{
			"banner":false,
			"logo":true
		}
		"interactivityProfileName":"interactive",
		"interactivityOverrides":"<interactivity-overrides-ID>",
	}
);

The following table describes available options for these properties and objects.

Property/Object	Default	Description
"interactivityOverrides":"<interactivity-overrides-ID>"	none	Specifies specific report and visual interactivity settings for an embedded report. The visual interactivity settings specified in this object will override any interactivity settings specified for the individual visuals. These settings will also override the report interactivity profile linked to the report (the one saved with the report) and the report interactivity profile passed by the interactivityProfileName property. Type: object

Here is a sample embedding "mode":

embedManager.createComponent('report',
	const componentConfig = {
		"reportId": "<report-ID>",
		"componentInstanceId":"<component-instance-ID>",
		"type":"report",
		"application":{
			"banner":false,
			"logo":true
		}
		"interactivityProfileName":"interactive",
		"interactivityOverrides":"<interactivity-overrides-ID>",
		"mode":"interactive",
	}
);

The following table describes available options for these properties and objects.

Property/Object	Default	Description
"mode":"interactive"	interactive	When a report interactivity profile is specified (using the interactivityOverrides object or the interactivityProfileName parameter), the mode parameter is ignored. The mode parameter is also deprecated in Symphony and will be removed in a future release. Type: string

Here is a sample embedding "theme":

embedManager.createComponent('report',
	const componentConfig = {
		"reportId": "<report-ID>",
		"componentInstanceId":"<component-instance-ID>",
		"type":"report",
		"application":{
			"banner":false,
			"logo":true
		}
		"interactivityProfileName":"interactive",
		"interactivityOverrides":"<interactivity-overrides-ID>",
		"mode":"interactive",
		"theme":"modern",
	}
);

The following table describes available options for these properties and objects.

Property/Object	Default	Description
"theme":"dark"	composer	The theme for the embedded report. Valid values are composer, modern, or dark. The initial default theme, composer, is the same as the modern theme. However, if you add your own themes to the application, more options are available in this list and you may have introduced a different default. Type: string

Here is a sample embedding "editor":

embedManager.createComponent('report',
	const componentConfig = {
		"reportId": "<report-ID>",
		"componentInstanceId":"<component-instance-ID>",
		"type":"report",
		"application":{
			"banner":false,
			"logo":true
		}
		"interactivityProfileName":"interactive",
		"interactivityOverrides":"<interactivity-overrides-ID>",
		"mode":"interactive",
		"theme":"modern",
		"editor":{ 
			"placement": "dockRight" 
		}
	}
);

The following table describes available options for these properties and objects.

Property/Object	Default	Description
"editor.placement":"dockRight"	modals	Indicates where the report editor appears. Valid editor placements are dockRight and modals. Type: string

Here is a sample embedding "header":

embedManager.createComponent('report',
	const componentConfig = {
		"reportId": "<report-ID>",
		"componentInstanceId":"<component-instance-ID>",
		"type":"report",
		"application":{
			"banner":false,
			"logo":true
		}
		"interactivityProfileName":"interactive",
		"interactivityOverrides":"<interactivity-overrides-ID>",
		"mode":"interactive",
		"theme":"modern",
		"editor":{ 
			"placement": "dockRight" 
		}
		"header": { 
			"title": "My Dash"
			"showActions": false,
			"showTitle": false,
			"visible": false
		}
	}
);

The following table describes available options for these properties and objects.

Property/Object	Default	Description
"header.title":"<newtitle>"	none	Allows you to overwrite the title of the embedded report. The embedded report title is read only; it cannot be changed while the report is embedded. Type: string
"header.showActions": false	true	Indicates whether report actions should be visible for the embedded report. Valid values are true or false. Type: boolean
"header.showTitle": false	true	Indicates whether the report title should be shown for the embedded report. Valid values are true or false. Type: Boolean
"header.visible": false	true	Indicates whether the report dashboard header should be shown for the embedded report. Valid values are true or false.

Here is a sample embedding "intialFilters":

intialFilters: {
	sourceId: "<source-id>"
	timeFilter: {
		from: "+$start_of_data",
		to: "+$end_of_data",
		timeField: "_saledate",
		},
	filters: [{
		"operation": "BETWEEN"
		"paths": "returns",
		"value": [ 1, 25 ]
	}]
}

The following table describes available options for these properties and objects.

Property/Object	Default	Description
initialFilters	none	Allows you to pass initial filters to the specified report. Pass parameters for filters, sourceId, timeFilter, and applyFiltersStrategy. Type: string
applyFiltersStrategy	overrideSamePath	Use overrideSamePath to overwrite filters using the same path. Use replaceExisting to remove all filters and use only defined initialFilters.

You can also refresh your data in the report as needed.

Method	Description
component.refreshData()	Refreshes data in the report when called.