AnsweredAssumed Answered

Hover on Feature Layer does not work on mobile

Question asked by yhuang_hla on Oct 26, 2017

I have tried to implement the hover function based on ArcGIS API for JavaScript Sandbox to select multiple features(polygons) by a freehand polyline. This works on desktop browsers, but not on mobile.

 

The problem happened because the 'mouse-*' events cannot be identified by the mobile browser. I have tried the 'touch' event in the dojo, but the results are not elegant and the touch motions are not natively supported by the API.

 

 

Codes: 

 

/* variables */
var self = this;
self.drawTool = new Draw(map);
self.selectedFeatureList = [];
self.highlightFillSymbol = new SimpleFillSymbol( // highlight fill symbol
   SimpleFillSymbol.STYLE_SOLID,
      new SimpleLineSymbol(
         SimpleLineSymbol.STYLE_SOLID,
         new Color([255, 0, 0]), 3
      ),
   new Color([125, 125, 125, 0.35])
);

 

/* simulate multiple selection by drawing with freehand polyline */
self.drawTool.activate(Draw.FREEHAND_POLYLINE);

/* event simulate the freehand polyline actions */
self.drawEvent.drawClick = map.on('mouse-down', function(evt) {
   self.drawEvent.drawOver = self.featureLayer.on('mouse-over', function(evt) {
      var graphic = evt.graphic;
      graphic.setSymbol(self.highlightFillSymbol);
      if (self.selectedFeatureList.indexOf(graphic) === -1) {
         self.selectedFeatureList.push(graphic);
      }
   });
// simulate over event for the mouse-down
self.featureLayer.emit('mouse-over', evt);
});

Outcomes