To show a map, it is first necessary to create a div tag with an ID that will be used in code later on. Then, handle the ASPxGridView's CustomJSProperties event that allows passing a custom array of cities' names and their coordinates from the server side to the client. After that, use this array in a function that creates a map object and places map pins with names of the cities at required coordinates. Handle the client-side Init event to show the map when the page is loaded. To show filtered results, handle the client-side BeginCallback event to set a flag (the "filtering" variable) when the ASPxGridView executes filter commands. Finally, handle EndCallback, which fires only when the flag is set and recreates the map.
A map is created in the createMap function in our client-side javascript code. The function first checks whether the variable that contains the map exists and, if so, destroys a previous instance. Create an object with map properties and then pass it to the map object constructor. Call the function which iterates through the cities' array stored in the ASPxClientGrid's "cpCities", because this array is passed in CustomJSProperties. The addPin function, which is called in addCityPins, adds pins to the map, thus adding a pushpin entity to the entity collection of the map class. Full documentation on the Microsoft Map service is available here.