Hello, I'm working on a search widget where users types in an id of a feature and then the map zooms in and highlights that feature from streamLayer. That function is working fine when I can see the feature(point), but when I don't see the feature(point), lets say I go to Japan and my feature is in America, my query cannot find that point, this is my logic:
zoomToFature(id: string) {
const highlightColor = new Color([255, 0, 0]);
this.layerView.highlightOptions = {
color: highlightColor,
haloOpacity: 0.8,
fillOpacity: 0.3,
};
const query = this.layerView.createQuery();
query.where = `route_id = ${parseInt(id)}`;
query.returnGeometry = true;
try {
this.layerView.queryFeatures(query).then((response) => {
if (this.highlight) {
this.highlight.remove();
}
if (response.features.length > 0) {
const pointGeometry = response.features[0].geometry;
this.mapView.goTo({
target: pointGeometry,
zoom: 15,
});
this.highlight = this.layerView.highlight(response.features);
} else {
console.error(`Point with ID ${id} not found.`);
}
});
} catch (err) {
console.log(err);
}
}
any ideas?