Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
Cancel
- Home
- :
- About RobertScheitlin__GISP
RobertScheitlin
MVP Emeritus
since
07-03-2014
06-08-2026
29992
Posts created
874
Kudos given
4533
Solutions
10911
Kudos received
Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
My Ideas
(1 Idea Submissions)Latest Contributions by RobertScheitlin__GISP
|
DOC
|
@LefterisKoumis Does that "Add Widget" sample have a popup template defined for the layer that it adds to the map? Honestly I have never tested this widget if a layer that is added by custom code.
... View more
10-19-2022
10:36 AM
|
0
|
0
|
26842
|
|
DOC
|
@DanielMx Is this app publicly available? I need to look at the widgets config.json so I can see what might be going wrong. Or you could just copy and paste the config.json portion for this layer.
... View more
10-19-2022
10:24 AM
|
0
|
0
|
19658
|
|
DOC
|
@DanielMxI have found the issue in the settings dialog with pre-defined values and have updated the 2.21 download link with the fixed version (2.21.2 of eSearch widget).
... View more
10-19-2022
09:29 AM
|
0
|
0
|
19678
|
|
DOC
|
@LefterisKoumis that is part of the Jewlery Box theme, not this widget.
... View more
10-19-2022
08:35 AM
|
0
|
0
|
26854
|
|
DOC
|
@DanielMx Sounds like it may be a bug. Can you confirm the version you are using? In WAB hold the "Alt" key and click anywhere on the eSearch widget and a dialog with version info will show.
... View more
10-19-2022
08:33 AM
|
0
|
0
|
19690
|
|
DOC
|
@DanielMx I have never had your situation occur. When you said you took a break do you mean you click ok on the "Add expression values" dialog or just leave WAB up and running with that dialog open and now the values you entered are missing?
... View more
10-19-2022
07:16 AM
|
0
|
0
|
19716
|
|
DOC
|
@DanielMx In the eSearch 2.21 version that label has been changed to "Search alias". The NLS property you are looking for in the NLS/strings.js file is searchType
... View more
10-19-2022
07:11 AM
|
0
|
0
|
19722
|
|
DOC
|
@LefterisKoumis This widget does not have a previous or next record controls. It is different from the popup panel widget in WAB. The feature panel widget just concatenates multiple records in the widget. You just scroll down to see the next feature.
... View more
10-19-2022
07:08 AM
|
0
|
0
|
26862
|
|
POST
|
To add to what @jcarlson is saying. The widget controller is responsible for that. Say you are using the foldable theme and adding a widget to the widget controller in the apps header. You will see as outlined in this image you can set a widget to open at start.
... View more
10-04-2022
08:07 AM
|
1
|
1
|
2639
|
|
DOC
|
@DanielMx The current version of this widget will work fine in WAB 2.5. Sorry for the delayed response.
... View more
09-29-2022
01:37 PM
|
0
|
0
|
19930
|
|
DOC
|
@AndyWells Sorry for the delay. I have been away for a few weeks. Correct zip file should be attached now.
... View more
09-29-2022
01:32 PM
|
0
|
0
|
12784
|
|
DOC
|
@LabastieMarie Version 1.9 is ready to use (no code changes needed).
... View more
09-16-2022
07:46 AM
|
0
|
0
|
12906
|
|
POST
|
@jaykapalczynski Here are my updates to your code UI wise has a bunch of updates to how things are styled and placed. Functionally the point method was not rendering the proper buffer visualization on the screen due to the improper symbol style being used and because the map is in webmercator the geometryEngine method should be geodesicBuffer and not buffer (my mistake there). <html>
<head>
<meta charset="utf-8" />
<meta
name="viewport"
content="initial-scale=1, maximum-scale=1,user-scalable=no"
/>
<title>Buffer Geometry</title>
<link rel="stylesheet" href="https://js.arcgis.com/4.24/esri/themes/light/main.css" />
<script src="https://js.arcgis.com/4.24/"></script>
<style>
html,
body {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
.flex-container {
height: 100%;
display: flex;
overflow: hidden;
}
#viewDiv {
flex: 2;
padding: 0;
margin: 0;
}
.side-panel {
padding: 1em;
overflow: auto;
}
.FixedHeightContainer {
float: left;
height: 380px;
width: 230px;
padding: 3px;
background: rgb(112, 128, 144, 0.5);
}
#info {
min-height: 17px;
}
.header {
height: 30px;
padding-top: 5px;
}
.geometryResultsdiv {
height: 345px;
overflow: auto;
background: #fff;
font-size: 8px;
}
.menu {
display: table;
width: 100%;
border: 1px solid black;
border-right: none;
box-sizing: border-box;
}
.menu>div {
display: table-row;
background-color: white;
}
.menu>div>div {
border-right: 1px solid black;
display: table-cell;
text-align: center;
vertical-align: middle;
}
@media screen and (max-width: 240px) {
.menu {
display: block;
float: left;
width: auto;
border: none;
}
.menu>div {
display: block;
}
.menu>div>div {
border: none;
padding-right: 10px;
display: block;
text-align: left;
}
}
.boxpadding {
margin: 8px 0;
}
.float-container {
display: flex;
padding: 2px;
gap: 8px;
margin: 8px 0;
}
.float-child1 {
flex: 1;
}
.float-child2 {
flex: 2;
}
</style>
<script>
function valDistance() {
d = document.getElementById("distance").value;
document.getElementById("infoDistance").textContent = "Distance: " + d;
}
function valType() {
t = document.getElementById("distanceType").value;
document.getElementById("infoType").textContent = "Type: " + t;
}
require([
"esri/Map", "esri/views/MapView", "esri/views/draw/Draw", "esri/Graphic", "esri/geometry/geometryEngine",
"esri/geometry/support/webMercatorUtils",
"esri/layers/GraphicsLayer"
], (Map, MapView, Draw, Graphic, geometryEngine, webMercatorUtils, GraphicsLayer) => {
var geometryType = "No Geometry Selected"
let bufferGralayer = new GraphicsLayer({
id: "BufferGraLyr",
});
bufferGralayer.opacity = 0.5;
const map = new Map({
basemap: "gray-vector",
layers: [bufferGralayer]
});
const view = new MapView({
container: "viewDiv",
map: map,
zoom: 10,
center: [-77.367, 37.55]
});
const draw = new Draw({
view: view
});
// THIS IS FOR THE BUTTONS IN THE SIDE BAR
document.getElementById("clear-button2").onclick = () => {
view.graphics.removeAll();
bufferGralayer.removeAll();
geometryType = "No Geometry Selected";
document.getElementById("info2").textContent = geometryType;
document.getElementById("geometryResultsdiv").textContent = "";
};
document.getElementById("point-button2").onclick = () => {
view.graphics.removeAll();
bufferGralayer.removeAll();
document.getElementById("geometryResultsdiv").innerText = "";
geometryType = "point";
document.getElementById("info2").textContent = "Geometry: " + geometryType;
const action = draw.create("point");
view.focus();
action.on("cursor-update", function (evt) {
updateVerticesPoint(evt.coordinates);
});
action.on("draw-complete", function (evt) {
updateVerticesPoint(evt.coordinates);
setTimeout(() => {
document.getElementById("geometryResultsdiv").innerText = JSON.stringify(bufferGralayer.graphics.items[0].geometry);
}, 200);
});
};
document.getElementById("polygon-button2").onclick = () => {
view.graphics.removeAll();
bufferGralayer.removeAll();
document.getElementById("geometryResultsdiv").innerText = "";
geometryType = "polygon";
document.getElementById("info2").textContent = "Geometry: " + geometryType;
const action = draw.create("polygon");
view.focus();
action.on(
[
"vertex-add",
"vertex-remove",
"cursor-update",
"redo",
"undo",
"draw-complete"
],
updateVerticesPolygon
);
};
document.getElementById("line-button2").onclick = () => {
view.graphics.removeAll();
bufferGralayer.removeAll();
document.getElementById("geometryResultsdiv").innerText = "";
geometryType = "line";
document.getElementById("info2").textContent = "Geometry: " + geometryType;
const action = draw.create("polyline");
view.focus();
action.on(
[
"vertex-add",
"vertex-remove",
"cursor-update",
"redo",
"undo",
"draw-complete"
],
updateVerticesLine
);
};
function updateVerticesPoint(coordinates) {
//// create a polyline from returned vertices
view.graphics.removeAll();
let point = {
type: "point", // autocasts as /Point
x: coordinates[0],
y: coordinates[1],
spatialReference: view.spatialReference
};
let graphic = new Graphic({
geometry: point,
symbol: {
type: "simple-marker", // autocasts as SimpleMarkerSymbol
style: "circle",
size: "16px",
color: [70, 90, 141, 0.4],
outline: {
color: [47, 76, 119, 0.5],
width: 1
}
}
});
view.graphics.add(graphic);
BufferGeom(graphic.geometry);
}
function updateVerticesPolygon(event) {
// create a polyline from returned vertices
if (event.vertices.length > 1) {
const result = createGraphicPolygon(event);
}
if(event.type === 'draw-complete'){
setTimeout(() => {
document.getElementById("geometryResultsdiv").innerText = JSON.stringify(bufferGralayer.graphics.items[0].geometry);
}, 200);
}
}
function updateVerticesLine(event) {
// create a polyline from returned vertices
if (event.vertices.length > 1) {
const result = createGraphicLine(event);
// if the last vertex is making the line intersects itself,
// prevent the events from firing
if (result.selfIntersects) {
event.preventDefault();
}
}
if(event.type === 'draw-complete'){
setTimeout(() => {
document.getElementById("geometryResultsdiv").innerText = JSON.stringify(bufferGralayer.graphics.items[0].geometry);
}, 200);
}
}
function createGraphicPoint(event) {
const vertices = event.vertices;
view.graphics.removeAll();
// a graphic representing the polyline that is being drawn
const graphicPnt = new Graphic({
geometry: {
type: "point",
spatialReference: view.spatialReference
},
symbol: {
type: "simple-marker", // autocasts as new SimpleFillSymbol
color: [255, 255, 255, 0.9], //[70,90,141,0.2],
opacity: 0.2,
outline: {
color: [255, 255, 255, 0.9], //[47,76,119, 0.2],
width: 1
}
}
});
view.graphics.add(graphicPnt);
BufferGeom(graphicPnt.geometry, 500);
}
function createGraphicPolygon(event) {
const vertices = event.vertices;
view.graphics.removeAll();
// a graphic representing the polyline that is being drawn
const graphicPoly = new Graphic({
geometry: {
type: "polygon",
rings: vertices,
spatialReference: view.spatialReference
},
symbol: {
type: "simple-fill", // autocasts as new SimpleFillSymbol
color: [70, 90, 141, 0.4],
outline: {
color: [47, 76, 119],
width: 1
}
}
});
view.graphics.add(graphicPoly);
BufferGeom(graphicPoly.geometry);
}
function createGraphicLine(event) {
const vertices = event.vertices;
view.graphics.removeAll();
// a graphic representing the polyline that is being drawn
const graphicLine = new Graphic({
geometry: {
type: "polyline",
paths: vertices,
spatialReference: view.spatialReference
},
symbol: {
type: "simple-line", // autocasts as new SimpleFillSymbol
color: [70, 90, 141, 0.4],
width: 1,
cap: "round",
join: "round"
}
});
// check if the polyline intersects itself.
const intersectingSegment = getIntersectingSegment(graphicLine.geometry);
// Add a new graphic for the intersecting segment.
if (intersectingSegment) {
view.graphics.addMany([graphicLine, intersectingSegment]);
}
// Just add the graphic representing the polyline if no intersection
else {
view.graphics.add(graphicLine);
BufferGeom(graphicLine.geometry);
}
// return intersectingSegment
return {
selfIntersects: intersectingSegment
};
}
function BufferGeom(geom) {
var d = parseInt(document.getElementById("distance").value);
var t = document.getElementById("distanceType").value;
const buffGeom = geometryEngine.geodesicBuffer(geom, d, t);
const buffgra = new Graphic({
geometry: buffGeom,
symbol: {
type: "simple-fill", // autocasts as new SimpleFillSymbol
color: [112, 128, 144],
width: 1,
cap: "round",
join: "round"
}
});
bufferGralayer.removeAll();
bufferGralayer.add(buffgra);
// document.getElementById("geometryResultsdiv").innerText = JSON.stringify(userDefinedGeometry);
}
// function that checks if the line intersects itself
function isSelfIntersecting(polyline) {
if (polyline.paths[0].length < 3) {
return false;
}
const line = polyline.clone();
//get the last segment from the polyline that is being drawn
const lastSegment = getLastSegment(polyline);
line.removePoint(0, line.paths[0].length - 1);
// returns true if the line intersects itself, false otherwise
return geometryEngine.crosses(lastSegment, line);
}
// Checks if the line intersects itself. If yes, change the last
// segment's symbol giving a visual feedback to the user.
function getIntersectingSegment(polyline) {
if (isSelfIntersecting(polyline)) {
return new Graphic({
geometry: getLastSegment(polyline),
symbol: {
type: "simple-line", // autocasts as new SimpleLineSymbol
style: "short-dot",
width: 3.5,
color: "yellow"
}
});
}
return null;
}
// Get the last segment of the polyline that is being drawn
function getLastSegment(polyline) {
const line = polyline.clone();
const lastXYPoint = line.removePoint(0, line.paths[0].length - 1);
const existingLineFinalPoint = line.getPoint(
0,
line.paths[0].length - 1
);
return {
type: "polyline",
spatialReference: view.spatialReference,
hasZ: false,
paths: [
[
[existingLineFinalPoint.x, existingLineFinalPoint.y],
[lastXYPoint.x, lastXYPoint.y]
]
]
};
}
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
document.getElementById("info").innerHTML = mp.x.toFixed(6) + ", " + mp.y.toFixed(6);
}
view.when().then(() => {
//after map loads, connect to listen to mouse move & drag events
view.on("pointer-move", showCoordinates);
});
});
</script>
</head>
<body>
<div class="flex-container">
<div id="viewDiv"></div>
<div class="esri-widget side-panel">
<div>
<h2>Geometry Selection</h2>
<span id="info"></span>
<div class="float-container">
<div class="float-child1">
<div>Distance</div>
</div>
<div class="float-child2">
<select name="distance" id="distance" onchange="valDistance()" style="width:75px;">
<option value="1"> 1</option>
<option value="2"> 2</option>
<option value="3"> 3</option>
<option value="5"> 5</option>
<option value="10"> 10</option>
</select>
</div>
</div>
<div class="float-container">
<div class="float-child1">
<div>Unit</div>
</div>
<div class="float-child2">
<select name="distanceType" id="distanceType" onchange="valType()" style="width:75px;">
<option value="miles">mile(s)</option>
<option value="feet">feet</option>
<option value="meters">meter(s)</option>
</select>
</div>
</div>
<div class="boxpadding" id="infoDistance">Distance: 1</div>
<div class="boxpadding" id="infoType">Unit: mile</div>
<div class="menu">
<div>
<div id="clear-button2" class="esri-widget esri-widget--button esri-interactive" title="Clear Grpahics">
<span class="esri-icon-erase"></span>
</div>
<div id="point-button2" class="esri-widget esri-widget--button esri-interactive" title="Draw point">
<span class="esri-icon-map-pin"></span>
</div>
<div id="line-button2" class="esri-widget esri-widget--button esri-interactive" title="Draw polyline">
<span class="esri-icon-polyline"></span>
</div>
<div id="polygon-button2" class="esri-widget esri-widget--button esri-interactive" title="Draw polygon">
<span class="esri-icon-polygon"></span>
</div>
</div>
</div>
<div id="info2" class="boxpadding">Geometry:</div>
<div class="FixedHeightContainer">
<div class="header" id="header">Results</div>
<div class="geometryResultsdiv" id="geometryResultsdiv"> </div>
</div>
</div>
</div>
</div>
</body>
</html>
... View more
09-15-2022
07:33 AM
|
1
|
1
|
1320
|
|
POST
|
Sorry that code was 3.x. For 4.x it is let buffGeom = bufferGralayer.graphics.items[0].geometry;
... View more
09-15-2022
07:05 AM
|
1
|
1
|
1323
|
My kudoed posts
| Title | Kudos | Posted |
|---|---|---|
| 1 | 04-14-2020 11:36 AM | |
| 17 | 05-17-2021 01:51 PM | |
| 1 | 07-06-2020 05:32 AM | |
| 1 | 07-10-2018 05:49 AM | |
| 9 | 01-28-2022 10:58 AM |
Activity Feed
- Got a Kudo for Print Widget EB 1.9.0. 3 weeks ago
- Got a Kudo for Re: Query - Spatial Relationship. 05-21-2026 10:45 AM
- Got a Kudo for Enhanced Locate Widget 1.9 - 8/4/22. 04-28-2026 03:39 PM
- Got a Kudo for Print Widget EB 1.9.0. 04-27-2026 02:20 PM
- Got a Kudo for Enhanced Locate Widget 1.9 - 8/4/22. 02-26-2026 07:28 AM
- Got a Kudo for Re: custom symbology for measurement widgets. 06-26-2025 10:53 AM
- Got a Kudo for Enhanced Locate Widget Version 2.16 - 08/21/2020. 06-19-2025 10:34 PM
- Got a Kudo for Re: How to highlight a feature on mouseover/hover in JS API 4.15?. 06-12-2025 08:47 PM
- Got a Kudo for Re: is javascript api and public maps are free to use ?. 05-22-2025 08:55 AM
- Got a Kudo for Re: Can someone send me the script files for one of their old web appbuilder apps that has street view?. 04-04-2025 10:24 AM
- Got a Kudo for Draw Widget EB 1.7.0 - 1/28/22. 03-12-2025 01:25 PM
- Got a Kudo for Enhanced Search Widget Version 2.23.1 - 11/22/22. 03-01-2025 09:56 PM
- Got a Kudo for Re: Enable ObjectID field for Find Locations and web map url parameters. 02-21-2025 01:56 AM
- Got a Kudo for Re: Ctrl + Mouse click. 02-11-2025 05:30 AM
- Got a Kudo for Re: Add a label from the graphic layer.. 02-03-2025 11:42 AM
- Got a Kudo for Re: configure typings for jimu-core. 01-29-2025 12:14 PM
- Got a Kudo for Re: Export to csv in attribute table is failing. 12-27-2024 03:02 PM
- Got a Kudo for Re: How to select all rows of FeatureTable 4.16 after it loads?. 12-11-2024 12:04 PM
- Got a Kudo for Re: WAB returns a 404 jimu.js/css/fonts/feature_actions.woff not found. 11-22-2024 02:24 PM
- Got a Kudo for Widgets in Development. 10-17-2024 01:38 AM
User Groups for RobertScheitlin__GISP
Contact Me
| Online Status |
Offline
|
| Date Last Visited |
06-08-2026
06:27 AM
|