The custom line chart widget can retrieve data using a database connection and an SQL query and display a bar chart from the resulting data.
Navigate to the Administration—Dashboards page. Click on the Actions—Create menu option to create a new dashboard. Give the dashboard a name and display the order number.
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1716476901660-image.png)
The dashboard designer canvas opens on a new page. Drag the Custom Line Chart Widget from the toolbox to the designer canvas. Click on the Edit icon to configure it.
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1716476913086-image.png)
The Configure Widget UI properties are displayed in the popup window below. Provide the title name. Select the database connection from the drop-down list. Provide the appropriate SQL Select syntax for the line chart algorithm. Use the $dateFilter (wildcard syntax) in the Where condition and an appropriate date column reference. Select the colors from the drop-down list for the chart heading, body, and legend text. Click on the Save button to confirm the changes.
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1716476965162-image.png)
On the dashboard designer canvas, select the UI - Preview menu option to view the dashboard.
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1716488608114-image.png)
The custom pie chart widget dashboard is displayed on the new page.
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1716488630442-image.png)
Use the date filter to render the chart to a different timeline. Hover the mouse on the bar to view the legend text.
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1716488648763-image.png)
To view the dashboard in the menu pane, select the Utils—Show/Hide option on the dashboard designer canvas.
![](https://static.helpjuice.com/helpjuice_production/uploads/upload/image/8802/direct/1716488971237-image.png)
Refresh the FlowWright Dashboard page to view the new dashboard in the left pane, as shown below.