AnsweredAssumed Answered

Replacing FeatureLayer graphic with a D3.js object

Question asked by jay.gregory on Sep 29, 2017
Latest reply on Oct 5, 2017 by TSolow-esristaff

Does anyone know how to replace graphics in a FeatureLayer with a D3.js object.  I'm not interested in simply using an SVG path, but actually replacing the node in which the graphic is rendered with a node from a d3 object.  I have little experience with d3, but from looking at Esri's documentation and digging into the console, I figure this shouldn't be too difficult.  I've included a simple example I would like to get working, but ideally I would eventually use a more complicated d3 object, constructed from feature attributes.  


 require(["esri/map", "esri/layers/FeatureLayer", "dojo/domReady!"], function(Map, FeatureLayer) {
            map = new Map("map", {
                basemap: "topo",
                center: [-97, 38],
                zoom: 5
            var svg = createD3Circle();
            var featureLayer = new FeatureLayer("myfeatureserviceurl");
            featureLayer.on('graphic-draw', function(graphic) {
                graphic.node = svg;
                //is there anything I can do here to replace each graphic with my svg object.
                //or possibly before the graphic even draws

            featureLayer.on('load', function() {
                var sType = featureLayer.surfaceType;
            function createD3Circle() {
                var svgContainer ="body").append("svg")
                    .attr("width", 200)
                    .attr("height", 200);
                var circle = svgContainer.append("circle")
                    .attr("cx", 30)
                    .attr("cy", 30)
                    .attr("r", 20);
                return circle;