POST
|
Hi there, I am trying to make a web app that overlays a map with circles of various sizes, based on data values in a database. I followed this tutorial, but it isn't resizing the circles, using either the "stops" method or the "min/max value" method. Here is how I define the layer: const dataLayer = new FeatureLayer({ source: [], // An empty list of Graphics, will be edited later when options are chosen title: "Fancy Map", objectIdField: "data_id", geometryType: "point", fields: [ {name: "data_id", type: "integer"}, {name: "location_id", type: "integer"}, {name: "location_name", type: "string"}, {name: "age_group_id", type: "integer"}, {name: "age_group_name", type: "string"}, {name: "year_id", type: "string"}, {name: "cause_id", type: "integer"}, {name: "cause_name", type: "string"}, {name: "deaths", type: "double"}, {name: "deaths_normalizer", type: "double"}, {name: "latitude", type: "double"}, {name: "longitude", type: "double"}, {name: "event_count", type: "integer"}, {name: "is_active", type: "integer"} ], renderer: { type: "simple", symbol: { type: "simple-marker", color: [226, 119, 40, 0.75], // orange outline: { color: "white", width: 1 }, visualVariables: [ { type: "size", field: "deaths", normalizationField: "deaths_normalizer", minDataValue: 0.0001, maxDataValue: 101.0, minSize: 5, maxSize: 50 // stops: [ // { // value: 0.0001, // size: 4, // }, // { // value: 100.0, // size: 20, // } // ] } ] } }, popupTemplate: { content: "<b>Location</b>: {location_name} <br> <b>Cause</b>: {cause_name} <br> <b>Age Group</b>: {age_group_name} <br> <b>Year</b>: {year_id} <br> <b>Number of events</b>: {event_count} <br> <b>Deaths</b>: {deaths}" } }); And here is how I define the points when adding them to the layer: let graphics = []; for (const event of data){ const point = { type: "point", latitude: event.latitude, longitude: event.longitude }; const graphic = new Graphic({ geometry: point, attributes: event }); graphics.push(graphic); } Is there anything obviously wrong with this? I haven't been able to find what is different from my code and the examples. Thank you in advance, Taylor
... View more
05-01-2020
02:15 PM
|
0
|
0
|
317
|
POST
|
Hi there, I am trying to make a web app that overlays a map with circles of various sizes, based on data values in a database. I followed this tutorial, but it isn't resizing the circles, using either the "stops" method or the "min/max value" method. Here is how I define the layer: const dataLayer = new FeatureLayer({ source: [], // An empty list of Graphics, will be edited later when options are chosen title: "Fancy Map", objectIdField: "data_id", geometryType: "point", fields: [ {name: "data_id", type: "integer"}, {name: "location_id", type: "integer"}, {name: "location_name", type: "string"}, {name: "age_group_id", type: "integer"}, {name: "age_group_name", type: "string"}, {name: "year_id", type: "string"}, {name: "cause_id", type: "integer"}, {name: "cause_name", type: "string"}, {name: "deaths", type: "double"}, {name: "deaths_normalizer", type: "double"}, {name: "latitude", type: "double"}, {name: "longitude", type: "double"}, {name: "event_count", type: "integer"}, {name: "is_active", type: "integer"} ], renderer: { type: "simple", symbol: { type: "simple-marker", color: [226, 119, 40, 0.75], // orange outline: { color: "white", width: 1 }, visualVariables: [ { type: "size", field: "deaths", normalizationField: "deaths_normalizer", minDataValue: 0.0001, maxDataValue: 101.0, minSize: 5, maxSize: 50 // stops: [ // { // value: 0.0001, // size: 4, // }, // { // value: 100.0, // size: 20, // } // ] } ] } }, popupTemplate: { content: "<b>Location</b>: {location_name} <br> <b>Cause</b>: {cause_name} <br> <b>Age Group</b>: {age_group_name} <br> <b>Year</b>: {year_id} <br> <b>Number of events</b>: {event_count} <br> <b>Deaths</b>: {deaths}" } }); And here is how I define the points when adding them to the layer: let graphics = []; for (const event of data){ const point = { type: "point", latitude: event.latitude, longitude: event.longitude }; const graphic = new Graphic({ geometry: point, attributes: event }); graphics.push(graphic); } Is there anything obviously wrong with this? I haven't been able to find what is different from my code and the examples. Thank you in advance, Taylor
... View more
05-01-2020
01:41 PM
|
0
|
0
|
266
|
Online Status |
Offline
|
Date Last Visited |
11-11-2020
02:24 AM
|