React Map - Overview

The Map is an interactive UI component that displays a geographic map with markers and routes.

View Demo

The code below adds the Map UI component to your page. The Map is centered and zoomed and supplied with controls that allow a user to zoom and navigate the Map or change its type.

  • import React from 'react';
  • import 'devextreme/dist/css/dx.light.css';
  •  
  • import { Map } from 'devextreme-react/map';
  •  
  • const centerCoordinates = { lat: 40.749825, lng: -73.987963 };
  •  
  • class App extends React.Component {
  • render() {
  • return (
  • <Map
  • defaultZoom={10}
  • controls={true}
  • defaultCenter={centerCoordinates}
  • />
  • );
  • }
  • }
  •  
  • export default App;
See Also