• What is KendoReact
  • Getting Started
  • Server Components
  • Components
    • Animation
    • Barcodes
    • Buttons
    • Chartsupdated
    • Common Utilities
    • Conversational UIupdated
    • Data Gridupdated
    • Data Query
    • Data Tools
    • Date Inputs
    • Date Math
    • Dialogs
    • Drawing
    • Dropdownsupdated
    • Editor
    • Excel Export
    • File Saver
    • Formupdated
    • Ganttupdated
    • Gauges
    • Indicators
    • Inputsupdated
    • Labels
    • Layoutupdated
    • ListBox
    • ListView
    • Map
    • Notification
    • OrgChartnew
    • PDF Processing
    • PDFViewer
    • PivotGrid
    • Popup
    • Progress Bars
    • Ripple
    • Scheduler
    • ScrollView
    • Sortable
    • Spreadsheetupdated
    • TaskBoard
    • Tooltips
    • TreeList
    • TreeViewupdated
    • Upload
  • Sample Applications
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Changelog
  • Updates
  • Troubleshooting

Bubble Map layer

The bubble map layer displays value proportions over geographic regions.

At each location, the layer will render a circle with an area proportional to the value. The rendered shape can be customized by setting symbol

Binding to Data

The Bubble map layer expects the data to contain two fields:

The following example demonstrates how to create a bubble layer:

Example
View Source
Change Theme:

Tooltips

The Map has a built-in tooltip for bubbles. To display the tooltip, define a bubble tooltip renderer.

The available fields in the bubble tooltip renderer context are:

  • dataItem—The original data item used to create the bubble.
  • layerIndex—The index of the bubble layer in the Map.
  • location—The location of the bubble.
  • value—The value of the bubble.

The bubble tooltip is demonstrated in the example below:

Example
View Source
Change Theme:

In this article

Not finding the help you need?