Fix drawing rectangle annotations on a rotated map.
If you create a rectangle annotation on a rotated map by clicking twice (rather than by clicking and dragging), the rectangle would be aligned to the map, not the screen.
MODIFY
src/annotation.js
src/annotation.js
@@ -616,6 +616,23 @@ var rectangleAnnotation = function (args) {
'strokeColor', 'strokeOffset', 'strokeOpacity', 'strokeWidth'];
};
+ /**
+ * Set three corners based on an initial corner and a mouse event.
+ *
+ * @param {array} an array of four corners to update.
+ * @param {geo.event} evt the mouse move event.
+ */
+ this._setCornersFromMouse = function (corners, evt) {
+ var map = this.layer().map(),
+ c0 = map.gcsToDisplay({x: corners[0].x, y: corners[0].y}, null),
+ c2 = map.gcsToDisplay(evt.mapgcs, null),
+ c1 = {x: c2.x, y: c0.y},
+ c3 = {x: c0.x, y: c2.y};
+ corners[2] = $.extend({}, evt.mapgcs);
+ corners[1] = map.displayToGcs(c1, null);
+ corners[3] = map.displayToGcs(c3, null);
+ };
+
/**
* Handle a mouse move on this annotation.
*
@@ -629,9 +646,7 @@ var rectangleAnnotation = function (args) {
}
var corners = this.options('corners');
if (corners.length) {
- corners[2] = $.extend({}, evt.mapgcs);
- corners[1].x = evt.mapgcs.x;
- corners[3].y = evt.mapgcs.y;
+ this._setCornersFromMouse(corners, evt);
return true;
}
};
@@ -659,9 +674,7 @@ var rectangleAnnotation = function (args) {
}
evt.handled = true;
if (corners.length) {
- corners[2] = $.extend({}, evt.mapgcs);
- corners[1].x = evt.mapgcs.x;
- corners[3].y = evt.mapgcs.y;
+ this._setCornersFromMouse(corners, evt);
this.state(annotationState.done);
return 'done';
}

MODIFY
tests/cases/annotation.js
tests/cases/annotation.js
@@ -292,7 +292,11 @@ describe('geo.annotation', function () {
expect(geojson.geometry.coordinates[0][2][1]).toBeCloseTo(1);
});
it('mouseMove', function () {
- var ann = geo.annotation.rectangleAnnotation({corners: corners});
+ var map = create_map();
+ var layer = map.createLayer('annotation', {
+ annotations: ['rectangle']
+ });
+ var ann = geo.annotation.rectangleAnnotation({layer: layer, corners: corners});
expect(ann.mouseMove({mapgcs: {x: 6, y: 4}})).toBe(undefined);
expect(ann.options('corners')).toEqual(corners);
ann.state(geo.annotation.state.create);

Fix drawing rectangle annotations on a rotated map.

If you create a rectangle annotation on a rotated map by clicking twice (rather than by clicking and dragging), the rectangle would be aligned to the map, not the screen.