Tutorial: Add a point, line, and polygon

Import modules and log in

1. Import the arcgis.gis, arcgis.geometry, arcgis.map.symbols and arcgis.map.popup modules. The GIS class provides the information model for a GIS hosted in ArcGIS OnlineArcGIS Online is a GIS mapping, analytics, data hosting, and content management software as a service (SaaS) product. It includes applications, tools, APIs, and location services for users and developers. It is subscription-based and requires an ArcGIS Online account.Learn more or Portal for ArcGISArcGIS portal, also known as a portal, is a website with applications and tools that can be used to create, manage, access, and share geospatial content and data. It supports security and authentication, developer credentials, content and data service management, user and group management, and site administration. A portal can be hosted in Esri's infrastructure or your own infrastructure.Learn more. The geometry module provides functions for managing and working with different geometric types. The symbols and popup modules provide the objects and functions needed to visualize and interact with the graphics on the map.

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   
   # Import modules
   from arcgis import GIS
   from arcgis.geometry import Point, Polyline, Polygon
   from arcgis.map.symbols import SimpleMarkerSymbolEsriSMS, SimpleLineSymbolEsriSLS, SimpleFillSymbolEsriSFS, SimpleFillSymbolStyle, SimpleMarkerSymbolStyle, SimpleLineSymbolStyle
   from arcgis.map.popups import PopupInfo
   
   
   

2. Log in anonymously to access publicly shared content. The data used in this tutorial is public so you do not need credentials to access it. If it were private data, you would be required to provide authentication.

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   
   # Import modules
   from arcgis import GIS
   from arcgis.geometry import Point, Polyline, Polygon
   from arcgis.map.symbols import SimpleMarkerSymbolEsriSMS, SimpleLineSymbolEsriSLS, SimpleFillSymbolEsriSFS, SimpleFillSymbolStyle, SimpleMarkerSymbolStyle, SimpleLineSymbolStyle
   from arcgis.map.popups import PopupInfo
   
   
   # Log in to portal
   portal = GIS()  # anonymously
   
   

Create the graphics

1. Use the Point class to create a new graphic. Use a dict object to create attributes and the SimpleMarkerSymbolEsriSMS class to create the pointA point is a type of geometry containing a single set of x,y coordinates and a spatial reference.Learn more symbol.

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   
   # Log in to portal
   portal = GIS()  # anonymously
   
   point_geometry = Point({"x": -118.8066, "y": 34.0006, "spatialReference": {"wkid":4326}})
   
   point_attributes = {"name": "Point", "description": "I am a point"}
   
   point_symbol =  SimpleMarkerSymbolEsriSMS(
       style = SimpleMarkerSymbolStyle.esri_sms_circle,
       color = [0, 0, 0],
       outline = SimpleLineSymbolEsriSLS(color = [255, 255, 255], width = 1),
   )
   
   

2. Use the Polyline class to create a new graphic object. Use a dict objects to create attributes and the SimpleLineSymbolEsriSLS class to create the polylineA polyline is a type of geometry containing ordered point coordinates and a spatial reference.Learn more symbol.

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   
   point_geometry = Point({"x": -118.8066, "y": 34.0006, "spatialReference": {"wkid":4326}})
   
   point_attributes = {"name": "Point", "description": "I am a point"}
   
   point_symbol =  SimpleMarkerSymbolEsriSMS(
       style = SimpleMarkerSymbolStyle.esri_sms_circle,
       color = [0, 0, 0],
       outline = SimpleLineSymbolEsriSLS(color = [255, 255, 255], width = 1),
   )
   
   polyline_geometry = Polyline({
       "paths": [[
           [-118.821527826096, 34.0139576938577],
           [-118.814893761649, 34.0080602407843],
           [-118.808878330345, 34.0016642996246],
       ]],
       "spatialReference": {"wkid":4326}
   })
   
   polyline_attributes = {"name": "Polyline", "description": "I am a Polyline"}
   
   polyline_symbol = SimpleLineSymbolEsriSLS(
       style = SimpleLineSymbolStyle.esri_sls_solid,
       color = [255, 155, 128],
       width = 2
   )
   
   

3. Use the Polygon class to create a new graphic object. Use a dict objects to create attributes and the SimpleFillSymbolEsriSFS class to create the polygonA polygon is a type of geometry containing an array of rings and a spatial reference. Each ring contains an array of point coordinates, where the first and last point are the same.Learn more symbol.

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   
   polyline_geometry = Polyline({
       "paths": [[
           [-118.821527826096, 34.0139576938577],
           [-118.814893761649, 34.0080602407843],
           [-118.808878330345, 34.0016642996246],
       ]],
       "spatialReference": {"wkid":4326}
   })
   
   polyline_attributes = {"name": "Polyline", "description": "I am a Polyline"}
   
   polyline_symbol = SimpleLineSymbolEsriSLS(
       style = SimpleLineSymbolStyle.esri_sls_solid,
       color = [255, 155, 128],
       width = 2
   )
   
   polygon_geometry = Polygon(
       {
           "rings": [
               [
                   [-118.818984489994, 34.0137559967283],
                   [-118.806796597377, 34.0215816298725],
                   [-118.791432890735, 34.0163883241613],
                   [-118.79596686535, 34.008564864635],
                   [-118.808558110679, 34.0035027131376],
               ]
           ],
           "spatialReference": {"wkid":4326}
       }
   )
   
   polygon_attributes = {"name": "Polygon", "description": "I am a Polygon"}
   
   polygon_symbol = SimpleFillSymbolEsriSFS(
       style = SimpleFillSymbolStyle.esri_sfs_solid,
       color = [50, 100, 200, 125],
       outline = SimpleLineSymbolEsriSLS(color = [255, 255, 255], width = 1)
   )
   
   

Display the results

1. Use the map method to create a new map widget.

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   
   polygon_geometry = Polygon(
       {
           "rings": [
               [
                   [-118.818984489994, 34.0137559967283],
                   [-118.806796597377, 34.0215816298725],
                   [-118.791432890735, 34.0163883241613],
                   [-118.79596686535, 34.008564864635],
                   [-118.808558110679, 34.0035027131376],
               ]
           ],
           "spatialReference": {"wkid":4326}
       }
   )
   
   polygon_attributes = {"name": "Polygon", "description": "I am a Polygon"}
   
   polygon_symbol = SimpleFillSymbolEsriSFS(
       style = SimpleFillSymbolStyle.esri_sfs_solid,
       color = [50, 100, 200, 125],
       outline = SimpleLineSymbolEsriSLS(color = [255, 255, 255], width = 1)
   )
   
   map = portal.map()
   map
   
   

2. Use the draw method to add each of the graphics, with their associated symbology and attributes, to the map. Use the popup parameter to build a popupInfo object from the attribute values.

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   
   map = portal.map()
   map
   
   map.content.draw(
       shape=polyline_geometry,
       symbol=polyline_symbol,
       popup=PopupInfo(title=polyline_attributes["name"], description=polyline_attributes["description"])
   )
   
   map.content.draw(
       shape=point_geometry,
       symbol=point_symbol,
       popup=PopupInfo(title=point_attributes["name"], description=point_attributes["description"])
   )
   
   map.content.draw(
       shape=polygon_geometry,
       symbol=polygon_symbol,
       popup=PopupInfo(title=polygon_attributes["name"], description=polygon_attributes["description"])
   )
   
   

3. Set the map center by passing in coordinates and provide a scale level. This will update the map extent so that the newly added graphics are displayed prominently in the view.

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   
   map.content.draw(
       shape=polyline_geometry,
       symbol=polyline_symbol,
       popup=PopupInfo(title=polyline_attributes["name"], description=polyline_attributes["description"])
   )
   
   map.content.draw(
       shape=point_geometry,
       symbol=point_symbol,
       popup=PopupInfo(title=point_attributes["name"], description=point_attributes["description"])
   )
   
   map.content.draw(
       shape=polygon_geometry,
       symbol=polygon_symbol,
       popup=PopupInfo(title=polygon_attributes["name"], description=polygon_attributes["description"])
   )
   
   map.center = [34.0122, -118.8055]
   map.zoom = 14
   
   

4. Optional: Use the export_to_html method to export the current state of the map widget to a static HTML file which can be viewed in any web browser.

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   
   map.center = [34.0122, -118.8055]
   map.zoom = 14
   
   import os
   
   file_dir = os.path.join(os.getcwd(), "home")
   if not os.path.isdir(file_dir):
       os.mkdir(file_dir)
   
   file_path = os.path.join(file_dir, "add-a-point-line-and-polygon.html")
   
   map.export_to_html(file_path, title="Add a point, line, and polygon")

Your map should display three graphics in the Santa Monica Mountains. Click on a graphic to display its popup.