Analysis Module: Chart Types

How to Use

"chartType": "bar"

Required Properties

chartType [String]

The type of your Vega Chart

These are the currently supported chart types with their corresponding max-width values:

• badge - 30rem
• bar - 60rem
• pie - 290px
• line - 30rem

The chart type is needed to specify the appropriate max-width to apply to the chart's container in the report.

In addition, Mapbuilder adds an autosize property. A width signal is also added to each analysis chart, based off of Vega's documentation (autosize & signals). Note that autosize property and width signal are only applied when the widget is rendered in the report. When a widget is rendered in the layer panel it will use the width and autosize specified in the configuration.

          type: 'fit',
          resize: true
        };

        const resizeWidthSignal = {
          name: "width",
          update: "containerSize()[0]*0.95",
          value: "",
          on: [
            {
              events: {
                source: "window",
                type: "resize"
              },
              update: "containerSize()[0]*0.95"
            }
          ]
        };

This allows for the charts to be centered aligned in the report as well as be responsive so that they display appropriately onn different screen sizes.