1

The problem is that I need to make it so that the point can only be moved after 400ms of holding the point

I add Translate for a point when adding the point itself Now the point can be moved at any time, the delay in onPointTranslateStart listener only works for my code inside the listeners, but not for canceling the point movement

let isTranslating = false;
let isTranslateAccept = true;
props.map.on("singleclick", onMapTouch);

const onMapTouch = async (event: ol.MapBrowserEvent<any>) => {
  if (isTranslating) return

  let newFeature = new ol.Feature(new Point(event.coordinate));
  let newNameID = Math.random().toString();
  newFeature.set('nameID', newNameID);

  rulerPoint.getSource()?.addFeature(newFeature);

  let features = rulerPoint.getSource()!.getFeatures();

  let translate = new Translate({
    features: new ol.Collection([features[features.length - 1]]),
    condition: (mapBrowserEvent) => {
      if (Condition.doubleClick(mapBrowserEvent) || Condition.singleClick(mapBrowserEvent) || Condition.doubleClick(mapBrowserEvent)) return false;
      return true;
    }
  });
  props.map.addInteraction(translate);
  translate.on('translatestart', onPointTranslateStart);
  translate.on('translateend', onPointTranslateEnd);
  translate.on('translating', onPointTranslating);
}

const onPointTranslateStart = async (event: TranslateEvent) => {
  isTranslateAccept = false;
  await setTimeout(() => {
    if (isTranslateAccept) {
      isTranslateAccept = true;
      return
    }
    isTranslateAccept = true
    isTranslating = true;

    //do something
  }, 400);
};

const onPointTranslating = (event: TranslateEvent) => {
  if (!isTranslateAccept) return

  //do something
};

const onPointTranslateEnd = async (event: TranslateEvent) => {
  if (!isTranslateAccept) {
    isTranslateAccept = true
    return
  }
  isTranslating = false;

  
    //do something
  isTranslateAccept = false
};

I tried these solutions for pre-checking before the Translate task, but events like mousedown in OpenLayers 7 don't seem to exist

How to get `mousedown` event on OpenLayers.Map?

var events = props.map.events;
events.register("mousedown",map,function(e){
    console.log("mousedown");
    return true;
},true);
FResh Lemon
  • 11
  • 1
  • It's not clear what you try to achieve, but if you want to listen to mousedown event you have to listen for pointerdown event instead. map.on('pointerdown', ()=> {}) – oterral Jun 27 '23 at 14:19
  • @oterral Thanks for the answer. This solution works for ol3 but not for ol7 or I didn't do something before using it. Events work for me from here https://openlayers.org/en/latest/apidoc/module-ol_MapBrowserEvent-MapBrowserEvent.html Such as click, dblclick and others, but there are no down events in the list. I tried to register() event, but it is also not in ol7. I'm trying to achieve a delay of 400ms before being able to translate point(feature) – FResh Lemon Jun 27 '23 at 21:35
  • map.on('pointerdown', ()=> {}) throws an error: No overload matches this call. The last overload gave the following error.ts Observable.d.ts: The last overload is declared here. – FResh Lemon Jun 27 '23 at 21:35
  • Listening pointer down works in ol7. Just test in basic OL official examples. Your "Observable ...." error seems to be a Typescript error because pointer down is not in the TS definition. Just use @ts-ignore to ignore it. – oterral Jul 14 '23 at 19:12

0 Answers0