Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
Cancel
- Home
- :
- About TaylorTeske2
TaylorTeske2
New Contributor II
since
09-15-2015
11-11-2020
8
Posts created
0
Kudos given
0
Solutions
1
Kudos received
Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
My Ideas
(0 Idea Submissions)Latest Contributions by TaylorTeske2
|
POST
|
Just checked the console and I am getting an error when I try to buffer: "The input unit and the spatial reference unit are not of the same unit type.ie Linear vs.Angular" Any ideas?
... View more
12-03-2016
09:07 AM
|
0
|
3
|
2536
|
|
POST
|
I added that text, and nothing happens with my buffer. It appears the point won't buffer at all. Is there maybe something wrong with my code for the buffer?
... View more
12-03-2016
08:56 AM
|
0
|
2
|
2536
|
|
POST
|
I appreciate your answer, but I need to write this in JavaScript without Web AppBuilder.
... View more
12-02-2016
04:14 PM
|
0
|
8
|
2536
|
|
POST
|
I am a bit new to JavaScript. I want to buffer the location of a person's position when they click the Locate Button Widget. I modified the Locate Widget in the JavaScript API 4.0 a little bit. I am trying to get the coordinates of the position when you click the button, so that I can create a point geometry to use in a buffer. I have looked around and can't find a firm answer. I saw that you need to use the getCurrentPosition function, but some reason I can't properly implement it in my code. This is what I have so far: <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
<title>Final Project</title>
<link rel="stylesheet" href="https://js.arcgis.com/4.1/esri/css/main.css">
<script src="https://js.arcgis.com/4.1/"></script>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
#legendDiv {
max-width: 300px;
background-color: black;
padding: 8px;
color: white;
opacity: 0.85;
}
p {
max-width: 400px;
background-color: black;
padding: 15px;
border: 1px solid white;
color: white;
opacity: 0.95;
}
#toggle {
bottom: 20px;
left: 20px;
position: absolute;
z-index: 99;
max-width: 105px;
background-color: black;
border-radius: 8px;
padding: 10px;
color: white;
opacity: 0.85;
}
.esri-locate {
font-size: 18px;
background-color: white;
color: red;
width: 120px;
height: 40px;
padding: 0;
margin: 0;
border-radius: 8px;
overflow: hidden;
cursor: pointer;
}
.esri-locate span {
display: none;
}
.esri-locate:after {
content: 'GeoProcess';
}
</style>
<script>
require([
"esri/Map",
"esri/layers/FeatureLayer",
"esri/views/MapView",
"esri/widgets/Legend",
"esri/config",
"esri/core/urlUtils",
"esri/widgets/Locate",
"esri/layers/GraphicsLayer",
"esri/Graphic",
"esri/symbols/SimpleFillSymbol",
"esri/geometry/geometryEngine",
"dojo/dom-construct",
"dojo/dom",
"dojo/on",
"dojo/domReady!"
], function(
Map,
FeatureLayer,
MapView,
Legend,
esriConfig,
urlUtils,
Locate,
GraphicsLayer,
Graphic,
SimpleFillSymbol,
geometryEngine,
domConstruct,
dom,
on) {
var floodLayer = new FeatureLayer({
url: "https://igems.doi.gov/arcgis/rest/services/igems_haz/MapServer/0",
visible: true
});
var volcanoeLayer = new FeatureLayer({
url: "https://igems.doi.gov/arcgis/rest/services/igems_haz/MapServer/1",
visible: true
});
var earthquakeLayer = new FeatureLayer({
url: "https://igems.doi.gov/arcgis/rest/services/igems_haz/MapServer/3",
visible: true
});
var hurricaneLayer = new FeatureLayer({
url: "https://igems.doi.gov/arcgis/rest/services/igems_haz/MapServer/5",
visible: true
});
var wildfireLayer = new FeatureLayer({
url: "https://igems.doi.gov/arcgis/rest/services/igems_haz/MapServer/10",
visible: true
});
var shelterLayer = new FeatureLayer({
url: "http://gis.fema.gov/REST/services/NSS/FEMA_NSS/MapServer/5",
visible: false
});
var gLayer = new GraphicsLayer({});
var map = new Map({
basemap: "dark-gray",
layers: [gLayer, shelterLayer, floodLayer, volcanoeLayer, earthquakeLayer, hurricaneLayer, wildfireLayer]
});
var view = new MapView({
container: "viewDiv",
center: [-96.050173, 39.216911],
zoom: 5,
map: map
});
var legend = new Legend({
view: view,
layerInfos: [{
layer: floodLayer,
title: "Floods"
},
{
layer: volcanoeLayer,
title: "Volcanoes"
},
{
layer: earthquakeLayer,
title: "Earthquakes"
},
{
layer: hurricaneLayer,
title: "Hurricanes"
},
{
layer: wildfireLayer,
title: "Wildfires"
}]
}, "legendDiv");
view.ui.add(legend, "bottom-right");
var info = domConstruct.create("infoDiv", {
innerHTML: "<p>This map presents the geospatial locations for current natural hazards events (such as earthquakes, hurricanes, floods, and wildfires) as well as the locations of FEMA shelters. <br> <br> By clicking the button, this application will geocode your location, create a 5-10 mile buffer around that location, and provide directions to the closest shelter.</p>",
});
view.ui.add(info, "top-right");
var shelterTog = dom.byId("shelterToggle");
var wildfireTog = dom.byId("wildfireToggle");
var hurricaneTog = dom.byId("hurricaneToggle");
var earthquakeTog = dom.byId("earthquakeToggle");
var volcanoeTog = dom.byId("volcanoeToggle");
var floodTog = dom.byId("floodToggle");
on(shelterTog, "change", function(){
shelterLayer.visible = shelterTog.checked;
});
on(wildfireTog, "change", function(){
wildfireLayer.visible = wildfireTog.checked;
});
on(hurricaneTog, "change", function(){
hurricaneLayer.visible = hurricaneTog.checked;
});
on(earthquakeTog, "change", function(){
earthquakeLayer.visible = earthquakeTog.checked;
});
on(volcanoeTog, "change", function(){
volcanoeLayer.visible = volcanoeTog.checked;
});
on(floodTog, "change", function(){
floodLayer.visible = floodTog.checked;
});
//Locate Position
var locateBtn = new Locate({
view: view,
});
locateBtn.startup();
view.ui.add(locateBtn, {
position: "top-left",
index: 0
});
//Creat a symbol for buffer
var fillSymbol = new SimpleFillSymbol({
color: [227, 139, 79, 0.8],
outline: {color: [255, 255, 255],
width: 1
}
});
//Begin geoprocessing
locateBtn.on("locate", function(geoProcess){
view.zoom = 15;
navigator.geolocation.getCurrentPosition(function(position) {
var pt = new Point ({
longitude: position.coords.longitude,
latitude: position.coords.latitude
});
var buffer = geometryEngine.buffer(pt, 100, "miles");
var bufferGraphic = new Graphic({
geometry: buffer,
symbol: fillSymbol
});
gLayer.add(bufferGraphic);
});
});
});
</script>
</head>
<body>
<div id="viewDiv"></div>
<div id="legendDiv"></div>
<span id="toggle">
<input type="checkbox" id="shelterToggle"> Shelters<br>
<input type="checkbox" id="wildfireToggle" checked> Wildfires<br>
<input type="checkbox" id="hurricaneToggle" checked> Hurricanes<br>
<input type="checkbox" id="earthquakeToggle" checked> Earthquakes<br>
<input type="checkbox" id="volcanoeToggle" checked> Volcanoes<br>
<input type="checkbox" id="floodToggle" checked> Floods
</span>
</body>
</html>
... View more
12-02-2016
04:05 PM
|
1
|
10
|
5085
|
|
POST
|
Robert, Thanks for the help! Probably should have checked the documentation more thoroughly.
... View more
11-22-2016
06:32 AM
|
0
|
0
|
373
|
|
POST
|
So I am new to JavaScript and the API. I have everything working in my code, except that the features of my CSVLayer will not show up in my legend. Any ideas on how to do this? The code is below: <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
<title>Homework 5</title>
<link rel="stylesheet" href="https://js.arcgis.com/4.1/esri/css/main.css">
<script src="https://js.arcgis.com/4.1/"></script>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 98%;
width: 98%;
}
#legendDiv {
max-width: 300px;
background-color: black;
padding: 8px;
color: white;
opacity: 0.85;
}
p {
max-width: 200px;
background-color: black;
padding: 15px;
border: 1px solid white;
color: white;
opacity: .75;
}
h1 {
background-color:#D8E0E2;
background-repeat:repeat-x;
border-bottom:1px solid #000000;
border-top:1px solid #000000;
color: black;
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: 16px;
font-weight: bold;
letter-spacing:1.1px;
margin: 15px 0 10px;
padding: 3px 10px;
text-align: center;
}
</style>
<script>
require([
"esri/Map",
"esri/layers/CSVLayer",
"esri/views/MapView",
"esri/renderers/UniqueValueRenderer",
"esri/symbols/SimpleMarkerSymbol",
"esri/config",
"esri/core/urlUtils",
"esri/widgets/Legend",
"dojo/dom-construct",
"dojo/domReady!"
], function(
Map,
CSVLayer,
MapView,
UniqueValueRenderer,
SimpleMarkerSymbol,
esriConfig,
urlUtils,
Legend,
domConstruct) {
var url = "http://opendata.dc.gov/datasets/4ac321b2d409438ebd76a6569ad94034_5.csv";
esriConfig.request.corsEnabledServers.push(url);
// urlUtils.addProxyRule({
// urlPrefix: "opendata.dc.gov",
// proxyUrl: "/sproxy/"
// });
var defaultSym = new SimpleMarkerSymbol({
color: "white",
size: "8px"
});
var elem = new SimpleMarkerSymbol({
color: "blue",
size: "12px"
});
var middle = new SimpleMarkerSymbol({
color: "green",
size: "16px"
});
var high = new SimpleMarkerSymbol({
color: "red",
size: "20px"
});
var renderer = new UniqueValueRenderer({
defaultSymbol: defaultSym,
defaultLabel: "Special",
field: "LEVEL_",
uniqueValueInfos: [
{
value: "ES",
symbol: elem,
label: "Elementary School"
},
{
value: "MS",
symbol: middle,
label: "Middle School"
},
{
value: "HS",
symbol: high,
label: "High School"
}]
});
var csvLayer = new CSVLayer({
url: url,
renderer: renderer,
longitudeField: "LONGITUDE",
latitudeField: "LATITUDE"
});
var map = new Map({
basemap: "dark-gray",
layers: [csvLayer]
});
var view = new MapView({
container: "viewDiv",
center: [-77.029681, 38.908349],
zoom: 12,
map: map
});
var legend = new Legend({
view: view,
layerInfos: [{
layer: csvLayer,
title: "Public Schools"
}]
}, "legendDiv");
view.ui.add(legend, "bottom-right");
var info = domConstruct.create("infoDiv", {
innerHTML: "<p>This map depicts all of the public schools in Washington, DC by type.</p>",
});
view.ui.add(info, "top-right");
});
</script>
</head>
<body>
<h1>DC Public Schools</h1>
<div id="viewDiv"></div>
<div id="legendDiv"></div>
</body>
</html>
... View more
11-19-2016
08:44 AM
|
0
|
2
|
992
|
My kudoed posts
| Title | Kudos | Posted |
|---|---|---|
| 1 | 12-02-2016 04:05 PM |
Activity Feed
- Got a Kudo for Geolocation coordinates to Point geometry to use in buffer. 10-13-2017 07:32 PM
- Posted Re: Geolocation coordinates to Point geometry to use in buffer on ArcGIS JavaScript Maps SDK Questions. 12-03-2016 09:22 AM
- Posted Re: Geolocation coordinates to Point geometry to use in buffer on ArcGIS JavaScript Maps SDK Questions. 12-03-2016 09:12 AM
- Posted Re: Geolocation coordinates to Point geometry to use in buffer on ArcGIS JavaScript Maps SDK Questions. 12-03-2016 09:07 AM
- Posted Re: Geolocation coordinates to Point geometry to use in buffer on ArcGIS JavaScript Maps SDK Questions. 12-03-2016 08:56 AM
- Posted Re: Geolocation coordinates to Point geometry to use in buffer on ArcGIS JavaScript Maps SDK Questions. 12-02-2016 04:14 PM
- Posted Geolocation coordinates to Point geometry to use in buffer on ArcGIS JavaScript Maps SDK Questions. 12-02-2016 04:05 PM
- Tagged Geolocation coordinates to Point geometry to use in buffer on ArcGIS JavaScript Maps SDK Questions. 12-02-2016 04:05 PM
- Tagged Geolocation coordinates to Point geometry to use in buffer on ArcGIS JavaScript Maps SDK Questions. 12-02-2016 04:05 PM
- Posted Re: Display CSVLayer in Legend? on ArcGIS JavaScript Maps SDK Questions. 11-22-2016 06:32 AM
- Posted Display CSVLayer in Legend? on ArcGIS JavaScript Maps SDK Questions. 11-19-2016 08:44 AM
- Tagged Display CSVLayer in Legend? on ArcGIS JavaScript Maps SDK Questions. 11-19-2016 08:44 AM
- Tagged Display CSVLayer in Legend? on ArcGIS JavaScript Maps SDK Questions. 11-19-2016 08:44 AM
- Tagged Display CSVLayer in Legend? on ArcGIS JavaScript Maps SDK Questions. 11-19-2016 08:44 AM
- Tagged Display CSVLayer in Legend? on ArcGIS JavaScript Maps SDK Questions. 11-19-2016 08:44 AM
- Tagged Display CSVLayer in Legend? on ArcGIS JavaScript Maps SDK Questions. 11-19-2016 08:44 AM
- Tagged Display CSVLayer in Legend? on ArcGIS JavaScript Maps SDK Questions. 11-19-2016 08:44 AM
Contact Me
| Online Status |
Offline
|
| Date Last Visited |
11-11-2020
02:24 AM
|