49.5. External components
In Business Central, you can add external components to a page. The components are disabled by default. To enable the external components, change the value of dashbuilder.components.enable system property to true.
The external component location is set and configured with the dashbuilder.components.dir system property. The default value of this system property is /tmp/dashbuilder/components. You must set the component under the components directory with a parent directory, which is used as the component ID. For example, if the component ID is mycomp and the component directory is /tmp/dashbuilder/components, then the component base directory is /tmp/dashbuilder/components/mycomp.
Business Central checks the manifest.json file in the components directory. The manifest.json must contain at least one name text parameter.
| Parameter | Description |
|---|---|
|
| Name of the component displayed under Components section. |
|
| Icon of the component displayed under Components section. |
|
| A flag that indicates that the component does not require a data set. |
|
|
The list of parameters are using |
Sample manifest.json file
{
"name": "Heat Map Experiment",
"icon": "fa fa-bell-o",
"parameters": [
{
"name": "svg",
"type": "text",
"defaultValue": "",
"label": "SVG XML",
"category": "SVG Content"
"mandatory": true
},
{
"name": "svgUrl",
"type": "text",
"defaultValue": "",
"label": "SVG URL",
"category": "SVG URL"
"mandatory": true
}
,
{
"name": "ksProcessId",
"type": "text",
"defaultValue": "",
"label": "Process ID",
"category": "Kie Server"
"mandatory": true
}
]
}49.5.1. Creating external components
The following procedure describes how to create and add the external components to a page:
Procedure
Set the component under components directory with a parent directory.
For example, if the component ID is
mycompand the component directory is/tmp/dashbuilder/components, then the component base directory is/tmp/dashbuilder/components/mycomp.-
Create the
manifest.jsonfile in the component directory. -
Create
index.htmlfile with HTML content. -
In a terminal application, navigate to
EAP_HOME/bin. To enable the external components, set the value of
dashbuilder.components.enablesystem property totrue:$ ~/EAP_HOME/bin/standalone.sh -c standalone-full.xml -Ddashbuilder.components.dir={component directory base path} -Ddashbuilder.components.enable=trueStart Business Central, go to Menu
Design Pages. External Components is available under Components pane.
- In the Components pane, expand the External Components and drag the required component types to the canvas.
- Click Save.
'%20d='M201.5%20305.5c-13.8%200-24.9-11.1-24.9-24.6%200-13.8%2011.1-24.9%2024.9-24.9%2013.6%200%2024.6%2011.1%2024.6%2024.9%200%2013.6-11.1%2024.6-24.6%2024.6zM504%20256c0%20137-111%20248-248%20248S8%20393%208%20256%20119%208%20256%208s248%20111%20248%20248zm-132.3-41.2c-9.4%200-17.7%203.9-23.8%2010-22.4-15.5-52.6-25.5-86.1-26.6l17.4-78.3%2055.4%2012.5c0%2013.6%2011.1%2024.6%2024.6%2024.6%2013.8%200%2024.9-11.3%2024.9-24.9s-11.1-24.9-24.9-24.9c-9.7%200-18%205.8-22.1%2013.8l-61.2-13.6c-3-.8-6.1%201.4-6.9%204.4l-19.1%2086.4c-33.2%201.4-63.1%2011.3-85.5%2026.8-6.1-6.4-14.7-10.2-24.1-10.2-34.9%200-46.3%2046.9-14.4%2062.8-1.1%205-1.7%2010.2-1.7%2015.5%200%2052.6%2059.2%2095.2%20132%2095.2%2073.1%200%20132.3-42.6%20132.3-95.2%200-5.3-.6-10.8-1.9-15.8%2031.3-16%2019.8-62.5-14.9-62.5zM302.8%20331c-18.2%2018.2-76.1%2017.9-93.6%200-2.2-2.2-6.1-2.2-8.3%200-2.5%202.5-2.5%206.4%200%208.6%2022.8%2022.8%2087.3%2022.8%20110.2%200%202.5-2.2%202.5-6.1%200-8.6-2.2-2.2-6.1-2.2-8.3%200zm7.7-75c-13.6%200-24.6%2011.1-24.6%2024.9%200%2013.6%2011.1%2024.6%2024.6%2024.6%2013.8%200%2024.9-11.1%2024.9-24.6%200-13.8-11-24.9-24.9-24.9z'/%3e%3c/svg%3e){kind=small}