I'm developing a custom widget on Experience Builder, that would basically have additionnal features than the Search Widget, especially since we have a particular geolocator.
It's all working good, until I want to add a marker to the map to mark the location searched by the user.
I tried to use the sample provided by the documentation and have slightly adapted for EB, but I get a Typescript error when I create the Graphic object ("t is undefined"). I don't get the error without these lines.
What am I missing ?
let graphicB = new Graphic({ // graphic with point geometry
geometry: new Point({ x: evt.value.x, y: evt.value.y }), // set geometry from user coordinates here
symbol: new SimpleMarkerSymbol({
type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
style: "square",
color: "blue",
size: "8px", // pixels
outline: { // autocasts as new SimpleLineSymbol()
color: [255, 255, 0],
width: 3 // points
}
}) // set symbol here
});
let layer = new GraphicsLayer({
graphics: [graphicB]
});
this.state.jimuMapView.map.add(layer);
TypeScript doesn't work with autocasting, so you'll have to add a Color and an Outline explicitly
symbol: new SimpleMarkerSymbol({
style: "square",
color: new Color([0, 0, 255]),
size: "8px",
outline: new SimpleLineSymbol({
color: new Color([255, 255, 0]),
width: 3
})
})
Thank you for your answer, I missed that indeed.
Unfortunately, I edited my code but I still get the same error.
When creating the Point with x/y, you also need to set the spatialReference. If you know the SR matches the the map, you can use view.SpatialReference.
geometry: new Point({
x: event.value.x, y: event.value.y,
spatialReference: view.spatialReference // set sr of Point
}),