Hi all,
goTo(features) is not working on polines layer:
I have made a little sample to test this, with 2 layers of different geometries, one is points, the other is polylines.
When I left click on map, I execute a Query and then I display result features highlighted, then I goTo() this selection of features. Features are correctly highlighted, but unfortunatly goTo() do not move to a correct place, actually it zooms to a bundle of found features (randomly not always the same from time to time) and if I span to another place faraway and click again to perform the Query, then the highlighting works always fine, but goTo() do not move anymore atall. I can see no JavaScript error, nor in the catch event of the goTo() function.
If I do the same test with a mouse center-click on my example, which performs Query on second layer which is containing points, features are found, highlighted and Zoomed correctly anytime.
Reagrds,
Chris
Here is the code:
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
<title>Sketch widget | Sample | ArcGIS API for JavaScript 4.xyz</title>
<link rel="stylesheet" href="https://js.arcgis.com/4.20/esri/themes/light/main.css" />
<script src="https://js.arcgis.com/4.20/"></script>
<style>
html,
body,
#viewDiv
{
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<script>
require([
"esri/widgets/Sketch",
"esri/widgets/Editor",
"esri/Map",
"esri/layers/FeatureLayer",
"esri/tasks/support/Query",
"esri/views/MapView",
"esri/PopupTemplate"
], (Sketch, Editor, Map, FeatureLayer, Query, MapView, PopupTemplate) =>
{
//-------------------------
var layerView1 = null;
var layerView2 = null;
var highlightSelect = null;
//"point" layer:
var aLayer1 = new FeatureLayer( "https://services5.arcgis.com/xyz/ArcGIS/rest/services/Captage/FeatureServer/0",
{
id: "CAPTAGE",
outFields: ["*"]
});
//"polyline" layer:
var aLayer2 = new FeatureLayer( "https://services5.arcgis.com/xxxxxxxxxxxxxxxxx/ArcGIS/rest/services/Canalisation/FeatureServer/0",
{
id: "CANAL",
outFields: ["*"]
});
const map = new Map(
{
basemap: "dark-gray-vector",
layers: [ aLayer1, aLayer2]
});
const view = new MapView(
{
container: "viewDiv",
map: map,
center: [1.824458, 42.696685 ],
zoom: 11
});
view.when(() =>
{
view.popup.defaultPopupTemplateEnabled = true;
view.whenLayerView( aLayer1 ).then(( layerView_) =>
{
layerView1 = layerView_;
});
view.whenLayerView( aLayer2 ).then(( layerView_) =>
{
layerView2 = layerView_;
});
view.on("click", function(ev)
{
if( ev.button == 2 ) //right click remove highlighted
{
if( highlightSelect != null )
highlightSelect.remove();
return;
}
else if( ev.button == 1 ) //center click choose points feature layer
{
var layerView = layerView1;//Choose here layer to use for search
aLayerToUse = aLayer1;
}
else //left click choose polines feature layer
{
var layerView = layerView2;//Choose here layer to use for search
aLayerToUse = aLayer2;
}
if( highlightSelect != null )
highlightSelect.remove();
//let queryString = "IDT like '%C%'";
let queryString = "1=1";
var query = new Query
({
returnGeometry: true, //we need geometries
outFields: ['*'],//we dont need all data, but if only one attribute is specified, no highLight occurs !
outSpatialReference: view.spatialReference,
where: queryString
});
console.log("Search= " + queryString);
aLayerToUse.queryFeatures( query ).then( function( results )
{
console.log("Results = " + results.features.length );
if( results.features.length > 0 )
{
highlightSelect = layerView.highlight( results.features );
view.goTo( results.features ).then(() => { //Goto not working with polines feature layer !?
console.log("ok");
}).catch((err) => {
console.log("Error: ", err);
});
}
})
.catch(function(err)
{
console.log(err);
});
});
});
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>