POST
|
I probably could reach it with the code below, but I'm not exactly sure where in the action icon is the shadowRoot to change. await customElements.whenDefined('calcite-list-item'); await delay(300); let node = document.querySelector(`#some-list-here`); if (node) { let el = node.shadowRoot.querySelectorAll('calcite-list-item'); if (el) { el.forEach((item) => { I'm not sure where the icon is in the shadowRoot // item.style.setProperty('icon', 'check'); }); } } From the website sample app. <html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<script type="module" src=https://js.arcgis.com/calcite-components/1.0.7/calcite.esm.js></script>
<link rel="stylesheet" type="text/css" href=https://js.arcgis.com/calcite-components/1.0.7/calcite.css />
</head>
<body>
<calcite-list selection-mode="multiple">
<calcite-list-item label="Hiking trails" value="hiking-trails">
<calcite-action slot="actions-start" icon="layer" text="Trails layer"></calcite-action>
</calcite-list-item>
<calcite-list-item label="Waterfalls" value="waterfalls">
<calcite-action slot="actions-start" icon="layer" text="Waterfalls layer"></calcite-action>
</calcite-list-item>
<calcite-list-item label="Rivers" value="rivers">
<calcite-action slot="actions-start" icon="layer" text="Rivers layer"></calcite-action>
</calcite-list-item>
</calcite-list>
</body>
</html>
... View more
03-14-2023
12:14 PM
|
0
|
0
|
888
|
POST
|
Before replacing the deprecated pick list item with the calcite-list-item, the selection-appearance icon defaulted to a simple check. I think the calcite-list-item selection-appearance icon looks really bad, especially with my design. I would like to override it or not show it at all. (BAD) calcite-list-item (GOOD) calcite-pick-list-item How do I change the icon to 'check' in JS or CSS?
... View more
03-14-2023
11:33 AM
|
0
|
6
|
906
|
POST
|
I was at first worried the mouse and keyboard would still zoom with constraints, but now I am using it and it works just right. Thanks.
... View more
03-13-2023
07:40 AM
|
1
|
0
|
346
|
POST
|
Thanks! I can check the size of the sketch, but not sure how to block drawing without destroying the sketch. I found this in community, but I'm not seeing a 'move'. There is a 'cursor-update'. no 'move'
if (event.toolEventInfo && event.toolEventInfo.type.includes("move")){
sketchViewModel.cancel();
} if(event.state === 'active') {
// console.log(`H ${event.graphic.geometry.extent.height} x W ${event.graphic.geometry.extent.width}`);
if(event.graphic.geometry.extent.width > 200) {
if (event.toolEventInfo && event.toolEventInfo.type.includes('cursor-update')) {
// cancel() completely destroying the sketch.
// how to just stop drawing the width without killing sketch?
sketchViewModel.cancel();
}
}
}
... View more
03-09-2023
10:39 AM
|
0
|
0
|
233
|
POST
|
I found this code to disable zoom. Any idea how restore or undo disable zooming, including removing the stepPropagation event? I checked the events in Chrome dev tools event listeners, but couldn't find it. function disableZooming() {
// Removes the zoom action on the popup
view.popup.actions = [];
// stops propagation of default behavior when an event fires
function stopEvtPropagation(event) {
event.stopPropagation();
}
// exlude the zoom widget from the default UI
view.ui.components = ["attribution"];
// disable mouse wheel scroll zooming on the view
view.on("mouse-wheel", stopEvtPropagation);
// disable zooming via double-click on the view
view.on("double-click", stopEvtPropagation);
// disable zooming out via double-click + Control on the view
view.on("double-click", ["Control"], stopEvtPropagation);
// disables pinch-zoom and panning on the view
view.on("drag", stopEvtPropagation);
// disable the view's zoom box to prevent the Shift + drag
// and Shift + Control + drag zoom gestures.
view.on("drag", ["Shift"], stopEvtPropagation);
view.on("drag", ["Shift", "Control"], stopEvtPropagation);
// prevents zooming with the + and - keys
view.on("key-down", (event) => {
const prohibitedKeys = ["+", "-", "Shift", "_", "=", "ArrowUp", "ArrowDown", "ArrowRight", "ArrowLeft"];
const keyPressed = event.key;
if (prohibitedKeys.indexOf(keyPressed) !== -1) {
event.stopPropagation();
}
});
}
... View more
03-09-2023
09:36 AM
|
0
|
2
|
388
|
POST
|
I'm looking to restrict the size of a polygon that a user can create with the sketch tool based on current extent. I can calculate the distance between lat and lon, but I will need an event that I can monitor while the polygon is being drawn. const sketchLayer = new GraphicsLayer();
sketchViewModel = new SketchViewModel({
view: view,
layer: sketchLayer,
pointSymbol: pointSymbol,
polylineSymbol: polylineSymbol,
polygonSymbol: polygonSymbol,
snappingOptions: {
enabled: true,
featureSources: [{ layer: sketchLayer, enabled: true }],
},
mode: 'click',
defaultCreateOptions: {
hasZ: false,
enableScaling: false,
enableRotation: false,
toggleToolOnClick: false,
shapeOperation: 'none',
},
updateOnGraphicClick: false,
});
sketchViewModel.on('create', (event) => {
if (event.state === 'complete') {
// know if the polygon dimensions are valid size before getting here.
}
});
... View more
03-06-2023
02:33 PM
|
0
|
2
|
263
|
POST
|
Thank you. Your answer indeed solves the drawback to client-side buffering. I made the change and it works well, performance is close to client-side with some minor noticeable delay in the buffer polygon. I also had enable returnGeometry and remove returnDistinctValues because it's not supported with it. I am curious to know why "queryFeatures" throws an error "TypeError: Cannot read properties of undefined (reading 'featureResult')" after several continuous queries are made. Basically, after a few queries, the response from ArgGIS server is empty and results in the error above. The error doesn't prevent subsequent queries, but I decided to handle the error by detecting it and continuing. Has to be a better way.
... View more
03-01-2023
02:33 PM
|
0
|
1
|
501
|
POST
|
I have a buffer featureLayer query that does not return features if part of the buffered area in the view is off screen. How can I get buffer results in this situation? Thanks. What is meant by "available to or visible" here in the documentation? I always want to return available regardless of visibile. To query features/graphics available to or visible in the View on the client rather than making a server-side query, you must use the FeatureLayerView.queryFeatures() method. https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-FeatureLayer.html#queryFeatures Here's my procedural code fragment. Step 1. Create queryFeatureLayer
const queryFeatureLayer = new FeatureLayer({
url: url,
geometryType: 'polygon',
title: 'myfeatureLayer',
spatialReference: {
wkid: 102659,
},
outFields: [
'OBJECTID',
and others...
]
});
Step 2. Wait for global object mapLayerView to be ready then run queryLayerView()
reactiveUtils
.whenOnce(() => !mapLayerView.updating)
.then(() => {
queryLayerView();
Step 3. Execute the queryLayerView
const queryObject = mapLayerView.createQuery();
queryObject.geometry = sketchGeometryMode();
queryObject.units = unitType;
queryObject.distance = bufferSize;
queryObject.spatialRelationship = 'intersects';
queryObject.outSpatialReference = view.spatialReference;
queryObject.returnQueryGeometry = true;
queryObject.returnDistinctValues = true;
queryObject.outFields = ['*'];
Step 4. Get results
return mapLayerView
.queryFeatures(queryObject)
.then((layerView) => { ... }
... View more
02-28-2023
12:38 PM
|
0
|
3
|
532
|
POST
|
Is there going to be a calciteListChange event for calcite-list as with the now deprecated calcite-pick-list?
... View more
02-21-2023
10:25 AM
|
1
|
3
|
512
|
POST
|
I recently posted a research question to the github project. We had to change CDN references from unpgk.com to js.arcgis.com because the former no longer responds reliably and appears to have security vulnerability issues, as far as our security goes. During the change, we found that js.arcgis.com performs very well compared to unpkg.com, but the latest version (1.0.7) doesn't exist at js.arcgis.com. Seems strange to me that the latest build wouldn't be here? Additionally, why is the Esri Calcite API documentation so far behind? Research question on github https://github.com/Esri/calcite-components/issues/6492
... View more
02-16-2023
07:23 AM
|
0
|
1
|
315
|
POST
|
The Search Widget occassionally returns this error to Chrome console on suggest-complete. Happens on first use but works as expected afterwards. This was reported in an earlier version here. https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/search-widget-console-errors-showing-up-in-version/m-p/1097835#M74658 Click in search field. suggest-complete Console message [esri.widgets.Search.SearchViewModel] TypeError: Cannot read properties of undefined (reading 'featureResult') at q (https://js.arcgis.com/4.25/:43:249) {stack: 'TypeError: Cannot read properties of undefine… at q (https://js.arcgis.com/4.25/:43:249)', message: 'Cannot read properties of undefined (reading 'featureResult')'} arg1: TypeError: Cannot read properties of undefined (reading 'featureResult')\n at a.parsePBFFeatureQuery (https://js.arcgis.com/4.25/:2160:431)\n at Module.<anonymous> (https://js.arcgis.com/4.25/:2140:466)\n at Generator.next (<anonymous>)\n at d (https://js.arcgis.com/4.25/:38:488)\n at q (https://js.arcgis.com/4.25/:43:249) {stack: 'TypeError: Cannot read properties of undefine… at q (https://js.arcgis.com/4.25/:43:249)', message: 'Cannot read properties of undefined (reading 'featureResult')'} message: 'Cannot read properties of undefined (reading 'featureResult')' stack: 'TypeError: Cannot read properties of undefined (reading 'featureResult')\n at a.parsePBFFeatureQuery (https://js.arcgis.com/4.25/:2160:431)\n at Module.<anonymous> (https://js.arcgis.com/4.25/:2140:466)\n at Generator.next (<anonymous>)\n at d (https://js.arcgis.com/4.25/:38:488)\n at q (https://js.arcgis.com/4.25/:43:249)' [[Prototype]]: Error m._consoleWriter @ js.arcgis.com/4.25/(index):150:331
... View more
01-12-2023
01:39 PM
|
0
|
1
|
295
|
POST
|
Can someone please point me to the API docs for actionsMenuEnabled? Thanks.
... View more
12-30-2022
11:43 AM
|
0
|
0
|
389
|
POST
|
You can remove all default actions // Removes the default actions from the popup view.popup.viewModel.includeDefaultActions = false; includeDefaultActions
... View more
12-30-2022
11:36 AM
|
3
|
3
|
1891
|
POST
|
This seems to have broken in beta 99. The "X" button is getting focus. beta 97 Sets focus on the component. By default, tries to focus on focusable content. If there is none, it will focus on the close button. To focus on the close button, use the close-button focus ID. let button = document.createElement('calcite-button');
button.setAttribute('slot', 'secondary');
button.innerHTML = 'Cancel';
??? not working
button.setFocus('close-button');
... View more
12-29-2022
10:01 AM
|
0
|
1
|
469
|
POST
|
How do I whenOnce when a MapView is loaded, including any buttons added to ui? Please include link to referenced api. Thanks. This doesn't work. reactiveUtils.whenOnce( () => view.loaded) .then(() => { ... });
... View more
12-22-2022
09:48 AM
|
0
|
1
|
250
|
Title | Kudos | Posted |
---|---|---|
1 | 03-18-2024 08:18 AM | |
1 | 01-08-2024 07:24 AM | |
3 | 12-30-2022 11:36 AM | |
1 | 03-13-2023 07:40 AM | |
1 | 02-21-2023 10:25 AM |
Online Status |
Offline
|
Date Last Visited |
3 weeks ago
|