Blazor Bubble Chart

    The Ignite UI for Blazor Bubble Chart is a type of Scatter Chart that show markers with variable scaling to represent the relationship among items in several distinct series of data or to plot data items using x and y coordinates. These coordinates of the data point are determined by two numeric data columns. The Bubble Chart draws attention to uneven intervals or clusters of data. This chart is often used to plot scientific data, and can highlight the deviation of collected data from predicted results. The Bubble Chart has many of the characteristics of the Scatter Marker Chart but with the option to have various radius scale sizes.

    Blazor Bubble Chart Example

    You can create Ignite UI for Blazor Bubble Chart in IgbDataChart control using the IgbBubbleSeries and two numeric axes, as shown in the example below.

    Blazor Bubble Chart with Single Series

    You can bind your data to DataSource property of IgbBubbleSeries and map data columns using its XMemberPath, YMemberPath, RadiusMemberPath properties, as shown in the example below:

    Blazor Bubble Chart with Multiple Series

    In Blazor Bubble Chart, binding multiple data sources works by setting each new data source to DataSource property of a additional IgbBubbleSeries, as shown in the example below:

    Blazor Bubble Chart Styling

    In Blazor Bubble Chart, you can customize shape of bubble markers using MarkerType property, their size with RadiusScale property, and their appearance using MarkerBrush, MarkerOutline, MarkerThickness properties. In addition, you can also color bubble markers based on a data column using FillMemberPath and FillScale properties. In this example, usage of above properties is demonstrated.

    Additional Resources

    API References

    The following table lists API members mentioned in the above sections: