ClassBreaksRenderer with CSVLayer

NathanRice — Thu, 14 Nov 2019 18:08:40 GMT

I am trying to create breaks in a csvlayer to differentiate points in my data by color or size. Ideally, I would be able to do something similar to what is in the tutorial found here: Class breaks renderer | ArcGIS API for JavaScript 3.22 . However, this doesn't seem to work as all the points are displayed as the same color. The code posted below is what I am currently working with.

Thank you,

Nathan

Re: ClassBreaksRenderer with CSVLayer

NathanRice — Thu, 14 Nov 2019 18:37:58 GMT

Here is the code that I am trying to run. When I run this, all of the points are the same color.

<!DOCTYPE html>

<html>

<head>

<title>CSVLayer sample</title>

<style>

html, body, #map {

height: 100%;

width: 100%;

margin: 0;

padding: 0;

}

body {

background-color: #FFF;

overflow: hidden;

font-family: "Trebuchet MS";

}

</style>

var map, csv;

require([

"esri/map",

"esri/layers/CSVLayer",

//"esri/Color",

"dojo/_base/Color",

"esri/symbols/SimpleMarkerSymbol",

"esri/renderers/ClassBreaksRenderer",

"esri/InfoTemplate",

"esri/config",

"dojo/domReady!"

], function(

Map, CSVLayer, Color, SimpleMarkerSymbol, ClassBreaksRenderer, InfoTemplate, esriConfig

) {

// Use CORS

//esriConfig.defaults.io.corsEnabledServers.push("earthquake.usgs.gov"); // supports CORS

// Use proxy if the server doesn't support CORS

esriConfig.defaults.io.proxyUrl = "/proxy/";

map = new Map("map", {

basemap: "streets",

center: [-85.25, 37.96],

zoom: 8

});

csv = new CSVLayer("KY_NOX.csv", { //local csv file

});

var symbol = new SimpleMarkerSymbol();

//symbol.setColor(new Color([150, 150, 150, 0.9]));

var renderer = new ClassBreaksRenderer(symbol, "${total_emissions}");

renderer.addBreak(0.0, 10.0, new Color([0, 200, 0, .5]));

renderer.addBreak(10.0, 100.0, new Color([0, 0, 200, .5]));

renderer.addBreak(100.0, Infinity, new Color([168, 168, 168, 1]));

var template = new InfoTemplate();

template.setTitle("<b> EIS Site ID </b>: ${eis_facility_site_id}");

template.setContent("<b>Facility</b>: ${facility_site_name} </br>"+"<b>County </b>: ${county_name} </br>" + "<b> Total Emissions </b>: ${total_emissions} Tons </br>" + "<b> Unit Type </b>: ${unit_type}");

csv.setInfoTemplate(template);

csv.setRenderer(renderer);

map.addLayer(csv);

});

</script>

</head>

<body>

</body>

</html>

Re: ClassBreaksRenderer with CSVLayer

UndralBatsukh — Fri, 15 Nov 2019 16:13:49 GMT

Hi there,

You have to pass in an instance of symbol to addBreaks method. You are passing in a color object in your code.

I modified your test app.

-Undral

topic Re: ClassBreaksRenderer with CSVLayer in ArcGIS JavaScript Maps SDK Questions

ClassBreaksRenderer with CSVLayer

Re: ClassBreaksRenderer with CSVLayer

Re: ClassBreaksRenderer with CSVLayer