Problem panning with Firefox and Chrome

Jean-FrancoisDucre-Robitaille — Tue, 05 Mar 2013 13:09:09 GMT

Hi,

I've a problem panning the map with Firefox and Chrome. I drag the mouse using the left button and nothing happens, but it pans when I drag with the scroll button! This doesn't happen with IE. The map is integrated in a rather complex javascript application and I doesn't know where to start to find the problem.

Thanks

Jean-François

Re: Problem panning with Firefox and Chrome

DianaBenedict — Tue, 05 Mar 2013 14:44:54 GMT

A couple of things that might be of help:

1) make sure to review the following help documentation to refer to the different pan and zoom options
http://help.arcgis.com/en/webapi/javascript/arcgis/jshelp/#intro_navigation
2) I have found that enabling and disabling toolbars such as draw and edit toolbars will enable and disable your pan and zoom functionality. So you will need to make sure that these toolbars are enabled in the correctly.
3) sometimes what might look functionality not working between various browers is really attributed to the fact that some handle "errors" on the page better than others and in reality there is simply a portion of the code that is causing an error therefore stopping all further execution of your code.

Without any specific code to look at, this is the most help we can offer.

Re: Problem panning with Firefox and Chrome

GokuSan — Thu, 09 Mar 2023 13:43:48 GMT

Hi.

I have the same problem. Can someone help me? This my code:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<title>Circle with Measure</title>

<link rel="stylesheet" href="https://js.arcgis.com/3.43/esri/css/esri.css">
<style>
html,
body,
#map {
height: 100%;
margin: 0;
padding: 0;
}
</style>
<script src="https://js.arcgis.com/3.43/"></script>
<script>
var map;

require(["esri/map",
"esri/graphic",
"esri/geometry/Circle",
"esri/geometry/Polyline",
"esri/symbols/SimpleMarkerSymbol",
"esri/symbols/SimpleFillSymbol",
"esri/symbols/SimpleLineSymbol",
"esri/symbols/TextSymbol",
"esri/symbols/Font",
"esri/Color",
"esri/geometry/geometryEngine",
"dojo/domReady!"],

function(Map,
Graphic,
Circle,
Polyline,
SimpleMarkerSymbol,
SimpleFillSymbol,
SimpleLineSymbol,
TextSymbol,
Font,
Color,
geometryEngine) {

map = new Map("map", {
basemap: "topo", //For full list of pre-defined basemaps, navigate to http://arcg.is/1JVo6Wd
center: [-120.537, 46.592], // longitude, latitude
zoom: 13
});

var centerPt = null;
var sfs = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,
new SimpleLineSymbol(SimpleLineSymbol.STYLE_DASHDOT,
new Color([255,0,0]), 2),new Color([255,255,0,0.25])
);
var drawCircle = new Graphic(null, sfs, null, null);
var sls = new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color([255,0,0]), 2)
var radiusLine = new Graphic(null, sls, null, null);
var font = new Font("20px", Font.STYLE_NORMAL, Font.VARIANT_NORMAL, Font.WEIGHT_BOLDER);
var ts = new TextSymbol("");
ts.setFont(font);
ts.setColor(new Color([255,0,0]));
ts.setOffset(0,20);
var radiusText = new Graphic(null, ts, null, null);

//onDragStart, record the centerPt
map.on("mouse-drag-start", function(evt) {
try{
map.disablePan();
map.disableMapNavigation();
console.log("drag start. Pan: " + map.isPan + ". Navigation: " + map.isMapNavigation);
map.graphics.add(drawCircle);
map.graphics.add(radiusLine);
map.graphics.add(radiusText);
centerPt = evt;
}catch(e){
console.log(e);
}
});

//onDrag, calculate distance between currentPoint and centerPt
map.on("mouse-drag", function(evt) {
console.log("drag. Pan: " + map.isPan);
var pl = new Polyline(map.spatialReference);
pl.addPath([centerPt.mapPoint, evt.mapPoint]);
var radius = geometryEngine.geodesicLength(pl, "meters");
var circle = new Circle({center: centerPt.mapPoint, radius: radius, geodesic: true, spatialReference: map.spatialReference});;
drawCircle.setGeometry(circle);
radiusLine.setGeometry(pl);
ts.setText(radius.toFixed(1) + " meters" + ". Area: " + geometryEngine.geodesicArea(circle, "square-kilometers") + "km2");
radiusText.setGeometry(centerPt.mapPoint);
//console.log("radius is:" + radius);
});

map.on("mouse-drag-end", function(evt) {
try{
map.enablePan();
map.enableMapNavigation();
console.log("drag end. Pan: " + map.isPan + ". Navigation: " + map.isMapNavigation);
}catch(e){
console.log(e);
}
});
});
</script>
</head>

</html>

In Firefox, don´t work as expected. In Chrome, OK.

topic Re: Problem panning with Firefox and Chrome in ArcGIS JavaScript Maps SDK Questions

Problem panning with Firefox and Chrome

Re: Problem panning with Firefox and Chrome

Re: Problem panning with Firefox and Chrome