I am stuck, trying to figure out how to create a simple graphic for adding a circle based on one point in my web map. I need the circle to be centered on my single point, with a radius of 5 miles. I saw examples for the geodesic circle and that didn't work for me, as well a creating a buffer, which I don't think I need. I just need a simple circle graphic. Is there a simple way to do this? I have a map with one point and need this graphic for a boundary. I apologize as I am new to this and trying to learn this API quickly.


  • Are you talking about this sample when saying the geodesic circle didn't work? – kenbuja Jun 11 '14 at 20:18
  • Yes, that works for me. But I just need a basic example of how to add a circle based on a point. I can just add that code to what I have to make it work and I just need a simple example, the fewer lines the better. – Bob C Jun 11 '14 at 20:19
  • Do you mean you want the code to show a circle from a pre-existing point and not where the user clicks? – kenbuja Jun 11 '14 at 20:24
  • Yes, however I do not need any onClick function. Just a fixed or static circle, centered on the single point. Thanks! – Bob C Jun 11 '14 at 20:46

This will give you a 5 mile geodesic circle around a predefined point.

<!DOCTYPE html>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="stylesheet" href="//js.arcgis.com/3.9/js/esri/css/esri.css">
    html, body, #map {
        height: 100%;
        width: 100%;
        margin: 0;
        padding: 0;


    <script src="//js.arcgis.com/3.9/"></script>
    var map;

      "esri/map", "esri/geometry/Circle", "esri/symbols/SimpleFillSymbol", "esri/symbols/SimpleMarkerSymbol", "esri/symbols/SimpleLineSymbol",
      "esri/graphic", "esri/geometry/Point", "esri/Color",
    ], function (
      Map, Circle, SimpleFillSymbol, SimpleMarkerSymbol, SimpleLineSymbol,
      Graphic, Point, Color
    ) {
        map = new Map("map", {
        basemap: "streets",
        center: [-77.036744, 38.897731],
        zoom: 12
        var symbol = new SimpleFillSymbol().setColor(null).outline.setColor("blue");
        var symbolPoint = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_X, 10,
              new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color([255, 0, 0]), 1),
              new Color([0, 255, 0, 0.25]));

        map.on("load", function () {
            var point = new Point([-77.036744, 38.897731]);
            var pointGraphic = new Graphic(point, symbolPoint);
            var circle = new Circle(point, {
                radius: 5,
                radiusUnit: esri.Units.MILES,
                geodesic: true
            var circleGraphic = new Graphic(circle, symbol);

    <div id="map"></div>
| improve this answer | |

From the ArcGIS website: it looks like your simplest bet is the buffer tool

you should be able to draw a buffer circle with the examples containing the buffer_analysis() command located on the page link above.

There was also some discussion earlier about creating a simplified circle polygon instead of the buffer tool you might be intereseted in checking out.

| improve this answer | |
  • I know how to create a buffer in ArcGIS, I am referring to the ArcGIS API for JavaScript. Not python, am I in the wrong forum? Wait, yeah I am trying to do this for my GIS website. Please advise... – Bob C Jun 11 '14 at 20:15
  • my bad. I didn't catch the javascript tag. – Snazzer Jun 11 '14 at 20:51

Use your point as the basis for a circle geometry. The create circles sample shows how to use that class.

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.