|
POST
|
I have added a FeatureLayer and still get nothing... <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no"> <title>Intro to MapView - Create a 2D map - 4.7</title> <style> html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%; } </style> <link rel="stylesheet" href="https://js.arcgis.com/4.7/esri/css/main.css"> <script src="https://js.arcgis.com/4.7/"></script> <script> require([ "esri/Map", "esri/views/MapView", "esri/geometry/support/webMercatorUtils", "esri/widgets/Search", "esri/widgets/Locate", "esri/widgets/Expand", "esri/layers/TileLayer", "esri/layers/FeatureLayer", "esri/widgets/LayerList", "esri/widgets/BasemapGallery", "dojo/dom", "dojo/domReady!" ], function(Map, MapView, webMercatorUtils, Search, Locate, Expand, TileLayer, FeatureLayer, LayerList, BasemapGallery, dom) { var droneimage1 = new TileLayer({ url: "https://tiles.arcgis.com/tiles/3xOwF6p0r7IHIjfn/arcgis/rest/services/a010002_1/MapServer", title: "Drone Image" }); var eco = new FeatureLayer({ url: "http://services.arcgis.com/3xOwF6p0r7IHIjfn/arcgis/rest/services/OK_LevelIII_Ecoregions/FeatureServer", title: "Oklahoma Ecoregions" }); var map = new Map({ basemap: "streets", layers: [droneimage1, eco] }); var view = new MapView({ container: "viewDiv", map: map, zoom: 15, center: [-103.064, 36.175] // longitude, latitude }); function showCoordinates(evt) { var point = view.toMap({x: evt.x, y: evt.y}); //the map is in web mercator but display coordinates in geographic (lat, long) var mp = webMercatorUtils.webMercatorToGeographic(point); //display mouse coordinates dom.byId("info").innerHTML = mp.x.toFixed(3) + ", " + mp.y.toFixed(3); } view.when(function(){ //after map loads, connect to listen to mouse move & drag events view.on("pointer-move", showCoordinates); }); // create a search widget var searchWidget = new Search({ view: view }); // create the locate widget var locateBtn = new Locate({ view: view }); // Add the locate widget to the top left corner of the view view.ui.add(locateBtn, { position: "top-left" }); // Add the search widget to the top right corner of the view view.ui.add(searchWidget, { position: "top-right" }); // create a layer list widget var layerList = new LayerList({ view: view, // executes for each ListItem in the LayerList listItemCreatedFunction: function (event) { // The event object contains properties of the // layer in the LayerList widget. var item = event.item; // set an action for zooming to the full extent of the layer item.actionsSections = [[{ title: "Zoom to layer", className: "esri-icon-zoom-out-fixed", id: "full-extent" }]]; } }); view.ui.add(layerList, "bottom-left"); // Create a BasemapGallery widget instance and set // its container to a div element var basemapGallery = new BasemapGallery({ view: view, container: document.createElement("div") }); // Create an Expand instance and set the content // property to the DOM node of the basemap gallery widget // Use an Esri icon font to represent the content inside // of the Expand widget var bgExpand = new Expand({ view: view, content: basemapGallery }); // Add the expand instance to the ui view.ui.add(bgExpand, "top-left"); }); </script> </head> <body> <div id="viewDiv"></div> <span id="info" style="position:absolute; right:25px; bottom: 25px; color:#000000; font-size: 12px; z-index:50;"></span> </body> </html>
... View more
09-20-2018
09:32 AM
|
0
|
2
|
6488
|
|
POST
|
Ah, OK, so my issue is this is a TileLayer rather than a FeatureLayer of MapImageLayer? (Smacks forehead.) OK, I will see what I can do if this is, indeed, the case. Once again, I truly appreciate your assistance. Todd
... View more
09-20-2018
09:16 AM
|
0
|
0
|
6488
|
|
POST
|
Yes, but it doesn't work. If you zoom anywhere else in the map and click it, it does nothing.
... View more
09-20-2018
09:03 AM
|
0
|
5
|
6488
|
|
POST
|
Robert, I appreciate your reply and your willingness to always help newbies like me on these issues. In this instance, I am merely using one layer and attempting to get a handle on the code before adding additional layers. So, while the map is currently at the extent of droneimage1 layer, this will not always be the case and I wish to enable users to use this functionality on other layers in a layer list, as well (which will all be in different locations and have different spatial extents). Thanks, Todd
... View more
09-20-2018
08:57 AM
|
0
|
7
|
6488
|
|
POST
|
I am trying to create a function to zoom to the extent of a layer. I have found a good example here, but my JavaScript skills and knowledge of the JSAPI is just not good enough to cannibalize and shoehorn this into my simple example (I only attempt my hand at it about once every eight months or so). Rather than further bumbling the code (and after seeking additional examples to no avail), I thought I would seek assistance from others much more knowledgeable than I. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no"> <title>Intro to MapView - Create a 2D map - 4.7</title> <style> html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%; } </style> <link rel="stylesheet" href="https://js.arcgis.com/4.7/esri/css/main.css"> <script ></script> <script> require([ "esri/Map", "esri/views/MapView", "esri/geometry/support/webMercatorUtils", "esri/widgets/Search", "esri/widgets/Locate", "esri/widgets/Expand", "esri/layers/TileLayer", "esri/widgets/LayerList", "esri/widgets/BasemapGallery", "dojo/dom", "dojo/domReady!" ], function(Map, MapView, webMercatorUtils, Search, Locate, Expand, TileLayer, LayerList, BasemapGallery, dom) { var droneimage1 = new TileLayer({ url: "https://tiles.arcgis.com/tiles/3xOwF6p0r7IHIjfn/arcgis/rest/services/a010002_1/MapServer", title: "Drone Image" }); var map = new Map({ basemap: "streets", layers: [droneimage1] }); var view = new MapView({ container: "viewDiv", map: map, zoom: 15, center: [-103.064, 36.175] // longitude, latitude }); function showCoordinates(evt) { var point = view.toMap({x: evt.x, y: evt.y}); //the map is in web mercator but display coordinates in geographic (lat, long) var mp = webMercatorUtils.webMercatorToGeographic(point); //display mouse coordinates dom.byId("info").innerHTML = mp.x.toFixed(3) + ", " + mp.y.toFixed(3); } view.when(function(){ //after map loads, connect to listen to mouse move & drag events view.on("pointer-move", showCoordinates); }); // create a search widget var searchWidget = new Search({ view: view }); // create the locate widget var locateBtn = new Locate({ view: view }); // Add the locate widget to the top left corner of the view view.ui.add(locateBtn, { position: "top-left" }); // Add the search widget to the top right corner of the view view.ui.add(searchWidget, { position: "top-right" }); // create a layer list widget var layerList = new LayerList({ view: view, // executes for each ListItem in the LayerList listItemCreatedFunction: function (event) { // The event object contains properties of the // layer in the LayerList widget. var item = event.item; // set an action for zooming to the full extent of the layer item.actionsSections = [[{ title: "Zoom to layer", className: "esri-icon-zoom-out-fixed", id: "full-extent" }]]; } }); view.ui.add(layerList, "bottom-left"); // Create a BasemapGallery widget instance and set // its container to a div element var basemapGallery = new BasemapGallery({ view: view, container: document.createElement("div") }); // Create an Expand instance and set the content // property to the DOM node of the basemap gallery widget // Use an Esri icon font to represent the content inside // of the Expand widget var bgExpand = new Expand({ view: view, content: basemapGallery }); // Add the expand instance to the ui view.ui.add(bgExpand, "top-left"); }); </script> </head> <body> <div id="viewDiv"></div> <span id="info" style="position:absolute; right:25px; bottom: 25px; color:#000000; font-size: 12px; z-index:50;"></span> </body> </html> Thanks, Todd
... View more
09-20-2018
08:26 AM
|
0
|
9
|
8424
|
|
POST
|
I have created a simple app to display an image over a basemap. I have included the Locate widget for users. When I test the code on my local machine (or even in the sandbox), it works great. However, when I upload it to my web server, the Locate widget disappears. This is perplexing. Anyone have any insight? I am including the code and a link to the sample site. Live site By the way, whileI have your attention and on a completely unrelated note, I am looking for a way to add a "zoom to layer" option, preferably to my layer list (there will eventually be a number of layers, this is just a crude example). <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no"> <title>Sample ARID Map</title> <style> html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%; } </style> <link rel="stylesheet" href="https://js.arcgis.com/4.8/esri/css/main.css"> <script ></script> <script> require([ "esri/Map", "esri/views/MapView", "esri/widgets/Search", "esri/widgets/Locate", "esri/widgets/Expand", "esri/layers/TileLayer", "esri/widgets/LayerList", "esri/widgets/BasemapGallery", "dojo/domReady!" ], function(Map, MapView, Search, Locate, Expand, TileLayer, LayerList, BasemapGallery) { var layer = new TileLayer({ url: "https://tiles.arcgis.com/tiles/3xOwF6p0r7IHIjfn/arcgis/rest/services/a010002_1/MapServer", title: "Drone Image" }); var map = new Map({ basemap: "streets", layers: [layer] }); var view = new MapView({ container: "viewDiv", map: map, zoom: 15, center: [-103.064, 36.175] // longitude, latitude }); // create a search widget var searchWidget = new Search({ view: view }); // create the locate widget var locateBtn = new Locate({ view: view }); // Add the locate widget to the top left corner of the view view.ui.add(locateBtn, { position: "top-left" }); // Add the search widget to the top right corner of the view view.ui.add(searchWidget, { position: "top-right" }); // create a layer list widget var layerList = new LayerList({ view: view, }); view.ui.add(layerList, "bottom-left"); // Create a BasemapGallery widget instance and set // its container to a div element var basemapGallery = new BasemapGallery({ view: view, container: document.createElement("div") }); // Create an Expand instance and set the content // property to the DOM node of the basemap gallery widget // Use an Esri icon font to represent the content inside // of the Expand widget var bgExpand = new Expand({ view: view, content: basemapGallery }); // Add the expand instance to the ui view.ui.add(bgExpand, "top-left"); }); </script> </head> <body> <div id="viewDiv"></div> </body> </html> Cheers and thanks. Todd
... View more
09-20-2018
07:00 AM
|
0
|
3
|
2096
|
|
POST
|
In ArcMap, one can split a polygon using an overlapping feature (Advanced Editing--Split Polygons). Looking at the editing options in ArcGIS Pro, I cannot find this functionality (though there is a split tool, which would allow me to do it manually. In many instances, this is not a viable option for me). Am I overlooking this functionality or does it currently not exist in Pro? Thanks, Todd
... View more
08-29-2017
05:13 PM
|
2
|
17
|
19727
|
|
POST
|
Funny, the individual who initially posted this suggestion is a friend of mine. I voted up, of course. Thanks for sharing the link.
... View more
08-28-2017
05:10 AM
|
1
|
0
|
2697
|
|
POST
|
Dan--I appreciate your comment. To be clear, though, I do not expect nor do I want an ArcMap clone. I do, however, want a product that can seamlessly meet my GIS needs that are currently being met elsewhere. As a almost everyday GIS user (I am using GIS on a Sunday evening) and GIS educator (I am taking the leap in my classes to ArcGIS Pro, despite my trepidation), there is certain core functionality that is absolutely imperative to my workflow. Being able to quickly and easily manage data is one of those things. Here's an example. If one of our users or one of my students is having problems with data "lining up" (it happens frequently), I need to be able to quickly and easily look at the layer's assigned coordinate system and determine whether it matches the actual coordinate system utilized by the data. All, l have to do is open up ArcCatalog or a blank ArcMap document and quickly review and, if necessary, alter the data. In ArcGIS Pro, if I have to go to ArcToolbox to define the projection, OK--so one handy shortcut has been eliminated, no big deal in the grand scheme of things. The larger issue is that with ArcGIS Pro, mere data management has become needlessly cumbersome. Sometimes, you simply don't need a project to ensure the integrity of someone's data.
... View more
08-27-2017
08:12 PM
|
1
|
1
|
2697
|
|
POST
|
Yes, but that needlessly adds additional steps that were previously readily available.
... View more
08-27-2017
06:04 PM
|
0
|
3
|
2697
|
|
POST
|
In ArcMap, one can simply right click on a feature class using Catalog and select properties to view the layers XY Coordinate System information and change it if need be. This simple, exceptionally important functionality appears to be missing from ArcGIS Pro: If I add the feature class to a map and view the properties, I can see this information (but, of course, cannot edit it): I cannot even begin to tell you how often I have to troubleshoot layer projection issues for individuals. Being able to quickly access and edit this information is a must.
... View more
08-27-2017
11:10 AM
|
1
|
8
|
3595
|
|
POST
|
Fantastic. Thank you for the quick reply. Works perfectly. Todd Fagin Oklahoma Natural Heritage Inventory/ Oklahoma Biological Survey
... View more
05-03-2017
01:57 PM
|
0
|
0
|
1211
|
|
POST
|
I have created a simple map that has two primary functions. First, users can click on the map and receive an info. window with the longitude/latitude of the clicked point. Second, individuals can search the map for a location. I have discovered something a bit intriguing, though. If an individual first clicks the map to get the coordinates, the info. window does not include "zoom to." However, if one first searches the map, then clicks, the info. window includes zoom to (enabling individuals to hone in on where they clicked). I really like this, but would like to have it there initially, as well, not just after one searchers. Seems like I am missing something simple. Suggestions would be greatly appreciated. Thanks, Todd <!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<title>Get Coordinates From Map</title>
<link rel="stylesheet" href="https://js.arcgis.com/3.20/esri/css/esri.css">
<style>
html, body, #map {
padding:0;
margin:0;
height:100%;
}
#BasemapToggle {
position: absolute;
top: 20px;
right: 20px;
z-index: 50;
}
#search {
display: block;
position: absolute;
z-index: 2;
top: 20px;
left: 74px;
}
#HomeButton {
position: absolute;
top: 95px;
left: 20px;
z-index: 50;
}
#messages{
background-color: #fff;
box-shadow: 0 0 5px #888;
font-family: Arial,Helvetica Neue,Helvetica,sans-serif;
font-size: 0.8em;
max-width: 15em;
padding: 0.5em;
position: absolute;
left: 20px;
bottom: 20px;
z-index: 40;
}
</style>
<script src="https://js.arcgis.com/3.20/"></script>
<script>
var map;
require([
"esri/map",
"esri/dijit/BasemapToggle",
"esri/dijit/Search",
"esri/dijit/HomeButton",
"dojo/domReady!"
], function(
Map, BasemapToggle, Search, HomeButton
) {
map = new Map("map", {
basemap: "streets",
center: [-98.526, 35.467784],
logo: false,
zoom: 7
});
var toggle = new BasemapToggle({
map: map,
basemap: "hybrid"
}, "BasemapToggle");
toggle.startup();
var search = new Search({
map: map
}, "search");
search.startup();
var home = new HomeButton({
map: map
}, "HomeButton");
home.startup();
map.on("load", function(){
map.infoWindow.resize(250,100);
});
map.on("click", addPoint);
function addPoint(evt) {
var latitude = evt.mapPoint.getLatitude();
var longitude = evt.mapPoint.getLongitude();
map.infoWindow.setTitle("Coordinates");
map.infoWindow.setContent(
"Longitude: " + longitude.toFixed(3) +
"<br>Latitude: " + latitude.toFixed(3)
);
map.infoWindow.show(evt.mapPoint, map.getInfoWindowAnchor(evt.screenPoint));
}
});
</script>
</head>
<body>
<span id="messages">Click map to get coordinates.</span>
<div id="map" class="map">
<div id="BasemapToggle"></div>
<div id="search"></div>
<div id="HomeButton"></div>
</div>
</body>
</html>
... View more
05-03-2017
01:14 PM
|
0
|
2
|
1922
|
|
POST
|
Robert, Once again, you have proven to be immensely helpful. It is greatly appreciated. I have been a GIS user since the time of ol' command line ArcInfo and ArcView 3.x. While I use the desktop tools with ease, I got a very belated start on going full throttle into the web development side of things. It is always nice to have an experienced, knowledgeable individual help with the learning curve. Again, I do greatly appreciate it. Todd
... View more
12-10-2015
11:23 AM
|
1
|
0
|
1646
|
| Title | Kudos | Posted |
|---|---|---|
| 1 | 06-12-2025 12:15 PM | |
| 1 | 11-14-2024 12:18 PM | |
| 1 | 11-13-2024 01:18 PM | |
| 1 | 06-13-2024 03:06 PM | |
| 1 | 05-12-2022 06:53 AM |
| Online Status |
Offline
|
| Date Last Visited |
06-13-2025
12:44 PM
|