Skip to main content

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

How to: Automatically Generate Bubble Chart Items from a Datasource

To generate bubble charts from a data source, do the following.

  1. Create a BubbleChartDataAdapter object and assign it to the VectorLayer.Data property.
  2. Bind a data source to the DataSourceAdapterBase.DataSource property of the object.
  3. Specify mappings to assign data fields to bubble properties. To do this, specify the MapPointMappingInfoBase.Latitude, MapPointMappingInfoBase.Longitude and MapBubbleMappingInfo.Value properties of the MapBubbleMappingInfo object assigned to the BubbleChartDataAdapter.Mappings property.
  4. Specify settings which are used to generate map bubble charts. To do this, specify the MapBubbleSettings object’s properties. This object can be accessed using the BubbleChartDataAdapter.BubbleSettings property of the adapter.
<dxm:VectorLayer x:Name="earthquakesLayer" ShapeFill="Orange" ToolTipEnabled="True" 
                 ToolTipPattern="{}{Month}/{Day}/{Year}&#x0a;Magnitude: %V%&#x0a;Depth: {Depth}km">
    <dxm:BubbleChartDataAdapter DataSource="{Binding Data}" 
                                ItemMaxSize="60" ItemMinSize="10">
        <dxm:BubbleChartDataAdapter.AttributeMappings>
            <dxm:MapItemAttributeMapping Member="day" Name="Day"/>
            <dxm:MapItemAttributeMapping Member="mon" Name="Month"/>
            <dxm:MapItemAttributeMapping Member="yr" Name="Year"/>
            <dxm:MapItemAttributeMapping Member="dep" Name="Depth"/>
        </dxm:BubbleChartDataAdapter.AttributeMappings>
        <dxm:BubbleChartDataAdapter.Mappings>
            <dxm:MapBubbleMappingInfo Latitude="glat" Longitude="glon" Value="mag"/>
        </dxm:BubbleChartDataAdapter.Mappings>
        <dxm:BubbleChartDataAdapter.BubbleSettings>
            <dxm:MapBubbleSettings MarkerType="Circle"/>
        </dxm:BubbleChartDataAdapter.BubbleSettings>
    </dxm:BubbleChartDataAdapter>
</dxm:VectorLayer>
See Also