Skip to content

Map Style

In this example, a map is drawn in a div container. The style attribute of the ym.map

Note: This feature is only available from Version 3.4 of the JS-API.

SmartMaps Map

<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <title>SmartMaps Map</title>
</head>
<body>
  <div id="map-wrapper">
    <!-- Predefined div for displaying the map. -->
    <div id="map" style="width: 100%; height: 300px;"></div>
  </div>
  <!-- SmartMaps API -->
  <script src="https://www.yellowmap.de/api_rst/api/loader?libraries=free-3&apiKey={API_KEY}"></script>

  <script>
    ym.ready(function(modules) {
      var map = ym.map("map", {
        // Define latitude and longitude.
        center: ym.latLng(49.001, 8.417),
        // Define zoom value.
        zoom: 12,
        // Define map style
        style: 'darkmode'
      });

      window.map = map;
    });
  </script>
</body>
</html>
Replace {API_KEY} with your actual API key to test the example locally.