How to add Custom Scatter Plot Widget with Best Fit Line and Custom Lines in a dashboard

In this article, we will guide you through the process of creating and publishing a custom Scatter Plot widget with a best fit line and custom lines in Bold BI.

Prerequisites

• Download the custom Scatter Plot widget from the attachment section.

Steps to Add the Custom Widget in Bold BI

1. Publish the custom widget to the Bold BI application by following the instructions in this help link.

2. Once published, the Custom Scatter Plot Widget will appear under the Miscellaneous section of the designer panel.

3. Add measure columns: Add one or more measure columns to the Y Value(s) data field and one or more measure columns to the X Value(s) data field. Change the summary type to “None” for all the measure columns bound to both the Y Value(s) and X Value(s) data fields.
   

   

4. The Custom Scatter Plot Widget will be rendered as shown below
   

   

Customizing the Scatter Plot Widget

• Show the best fit line: To display the best fit line for the plotted series, enable the “Show Best Fit Line” property in the property panel.
  

  
  
  
  

• Add custom lines: Custom lines can be added to the scatter plot by using the “Custom X Values” and “Custom Y Values” textbox properties in the property panel. The text added to these properties must be a JSON string that supports more than one collection of data in a specific format.

• The text added to the “Custom X Values” property must be a JSON string which can support more than one collection of data which should be
  in the following format: [{"x1":"3","x2":"7"}, {"x1":"3","x2":"3"}, {"x1":"7","x2":"7"}, {"x1":"3","x2":"7"}, {"x1":"7","x2":"10"}, {"x1":"10","x2":"10"}, {"x1":"7","x2":"10"}, {"x1":"3","x2":"5"}, {"x1":"5","x2":"10"}]. Here in each object of the JSON array the “x1” specifies the x-axis value of the starting point of the line, the “x2” specifies the x-axis value of the ending point of the line.

• The text added to the “Custom Y Values” property must be a JSON string which can support more than one collection of data which should be
  in the following format: [{"y1":"2","y2":"2"}, {"y1":"2","y2":"6"}, {"y1":"2","y2":"6"}, {"y1":"6","y2":"6"}, {"y1":"2","y2":"4"}, {"y1":"4","y2":"8"}, {"y1":"6","y2":"8"}, {"y1":"6","y2":"8"}, {"y1":"8","y2":"8"}]. Here in each object of the JSON array the “y1” specifies the y-axis value of the starting point of the line, the “y2” specifies the y-axis value of the ending point of the line.
  

  
  
  
  

Conclusion

By following these steps, you can create and publish a custom Scatter Plot widget with a best fit line and custom lines in Bold BI. This will allow you to visualize your data in a more customized and meaningful way.