Hello Team,
We are using the <Map> Component from the @esri/react-arcgis library and it has the properties like viewProperties, children.
<Map viewProperties={{ extent, zoom: 12, popup: { dockOptions: { buttonEnabled: false, }, }, constraints: { geometry: fullEarthGeometry, minScale: zoomedOutEarthScale, rotationEnabled: false, }, }} > {props.children} <AnotherComponent /> </Map>
Now, we are migrating the @esri/react-arcgis to @ArcGIS/core library, however, the new library doesn't support the above properties like children and viewProperties. Could you please guide me.
Thanks,
Hari
Solved! Go to Solution.
@HariKrishnaInukollu
If you're using /core you create a object from the class Map, and then can just access it's properties directly.
Same applies for MapView.
The 'container' property refers to a div with a matching ID.
e.g:
import MapView from "@arcgis/core/views/MapView"
const mapView = new MapView({
container: "mapView",
map: webMap,
constraints: {
minScale: 70000,
maxScale: 1000,
},
})
So you wouldn't use children any more, as the map is it's own item in the DOM,
But you can add widgets and such using the .ui property:
import Compass from "@arcgis/core/widgets/Compass"
mapView.ui.add(
new Compass({
view: mapView,
}),
{ position: "top-left" }
)
@HariKrishnaInukollu
If you're using /core you create a object from the class Map, and then can just access it's properties directly.
Same applies for MapView.
The 'container' property refers to a div with a matching ID.
e.g:
import MapView from "@arcgis/core/views/MapView"
const mapView = new MapView({
container: "mapView",
map: webMap,
constraints: {
minScale: 70000,
maxScale: 1000,
},
})
So you wouldn't use children any more, as the map is it's own item in the DOM,
But you can add widgets and such using the .ui property:
import Compass from "@arcgis/core/widgets/Compass"
mapView.ui.add(
new Compass({
view: mapView,
}),
{ position: "top-left" }
)