esri example

by karthick6891

HTML

<!--ESRI JavaScript API-->
    <link rel="stylesheet" href="https://js.arcgis.com/4.2/esri/css/main.css">
    <!--ESRI JavaScript API-->
    <script src="https://js.arcgis.com/4.2/"></script>
    
    <div id="map">
    </div>

    <script>
        require([
          "esri/Map",
          "esri/views/MapView",
          "esri/Graphic",
          "esri/geometry/Point",
          "esri/PopupTemplate",
          "esri/symbols/PictureMarkerSymbol",
          "esri/symbols/SimpleMarkerSymbol",
          "dojo/domReady!"
        ], function (
          Map,
          MapView,
          Graphic,
          Point,
          PopupTemplate,
          PictureMarkerSymbol,
          SimpleMarkerSymbol
        ) {
        
         		var map = new Map({
                basemap: "hybrid"
            });

            var view = new MapView({
                center: [80.210800,13.118250],
                container: "map",
                map: map,
                zoom: 19
            });
            
              var circleSym = new SimpleMarkerSymbol({
                style: "circle",
                color: "red",
                size: "12px"
            });


            var pt = new PopupTemplate({
              title: "New Title",
              content: "New Content"
          });
          
          var point = new Point({
              longitude: 80.210800,
              latitude: 13.118250
          });
            
          var pointGraphic = new Graphic({
               geometry: point,
               symbol: circleSym,
               popupTemplate: pt
          });
           view.graphics.add(pointGraphic);

        });
    
    </script>

CSS

html,
        body,
        #map {
            padding: 0;
            margin: 0;
            height: 100%;
            width: 100%;
        }