Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

MSPbots Widgets help you to quickly view A Line Chart widget is another widget type that MSPbots users can utilize to highlight key data and highlight action items at a glance. This article shows how you can start creating your own widget which you can further customize according to your business needs.Do these steps to create a Line Chart widget:identify actionable items. It is helpful when you want to visualize trends in data and measure the impact of these trends on your MSP's operations and goals over time.

What's in this article

Table of Contents

How to design a line chart widget

...

  1. On the MSPbots menu, navigate to Widgets.
  2. On the Widgets tab, click New Widget.

     Image Removed

...

  1. This action opens the New Widget window.
    New WidgetImage Added
  2. On the New Widget window, select the Line Chart widget type

...

  1. .

...


  1. Line Chart WidgetImage Added 

...

  1. When the Widget Builder window opens, provide the following:
    • Name - Give the widget a Name.
    • Description - Provide a short Description.
    • Role - Select 

...

    • User or Admin. 
      Widget BuilderImage Added
  1. Click the 

...

  1. Apply button.

...

Image Removed

...

  1. Go to 

...

  1. Dataset and click (plus) button.

...


  1. data sourceImage Added
  2. When the Add New Layer window

...

  1. appears

...

  1. , click New Layer.
    add new layerImage Added
  2. Do the following on the Dataset window: 
    1. Select a dataset to use.
    2. Provide a name for the dataset used.
    3. Add columns by selecting an option from the Column Name dropdown list and assigning an Alias and Business Type for each. Click the

...

    1. (plus) button to add more rows.  
    2. Add filters, measures, and dimensions.

...

    1. Choose a value for Order By and input a value for Row Limit, if necessary. 
  1. Click the 

...

  1. Save button.

...


...

  1. datasetImage Added

...

  1. Click Apply. This will show a default preview of the

...

  1. line chart that you created. 

...

  1. Next, go to Config

...

  1. . Provide data for the following fields:

...

    • Line Chart Title - Provide

...

    • a title for the data being presented
    • Dimension - Select the data

...

    • for the x-axis (horizontal)

...

    • Set Goal - Provide a preferred set goal, if necessary.
    • Goal Color - Select

...

    • an appropriate color

...

    • for the set goal.
    • Set Smooth - Tick the Set Smooth box to have smooth lines for the line chart.
    • Measure - Select the data

...

    • for the y-axis (vertical)

...

    • of the bar chart. 
    • Dimension Group - Select a preferred dimension group

...

    • from the dropdown list, if necessary. 
    • Trendline - Select a preferred trendline

...

    • from the dropdown list, if necessary. 
    • Dimension Name - Provide the name

...

    • for x-axis of the line chart. 
    • Measure Name - Provide the name

...

    • for the y-axis (vertical)

...

    • . 
    • yAxis NameLocation - Select a preferred location for the Measure Name (Start, Center, End)

...

    • from the dropdown list, if necessary. 
    • yAxis NameGap - Provide a preferred number of

...

    • gaps for Measure Name, if necessary. 
    • xAxis Label Rotate - Provide a preferred orientation for Dimension Name, if necessary.

...

    •  

...

...

  1. If you want to change the text or background color when the fields and measures meet specific conditions, set a conditional formatting rule for your

...

  1. line chart. Go to Conditional Formatting and add rules to define the conditions. Once a rule

...

  1. is set, click 

...

  1. Apply on the widget rule window.
    Conditional FormattingImage Modified

...

  1. Lastly, click 

...

  1. Apply on the widget to show a preview of the widget.

How to create a stacking line widget

...

Stacked line charts help you visualize the relative contribution of different variables over a specified time. You can create this kind of chart for your widget by following the procedure for creating a line chart and selecting the Stacked Area Style option in the MSPbots app Widget Builder. 

After filling the fields under Config in Step 11 for creating a line chart, scroll down and select the Stacked Area Style option.  

stacked area chartImage Added

Video Instructions

...

Watch this video or follow the procedure below to create a line chart widget.

Widget Connector
urlhttp://youtube.com/watch?v=F5sbCCbN6HU