Added line annotations.

Rectangle annotations can be created by clicking opposite points rather than dragging the outline.  This allows them to be created on a touch device.

Added style and editstyle convenience functions to annotations -- rather than have to ask for annotation.options('style'), you can do annotation.style().

Fix an issue with the touch handler that produced an offset to the touch event.

Fix an issue in the line feature that didn't recompute the search data when just styles were changed.

Fix an issue with the lines demo where the tooltip wouldn't always show.

examples/annotations/example.json

@@ -4,6 +4,6 @@
   "exampleCss": ["main.css"],
   "exampleJs": ["main.js"],
   "about": {
-    "text": "This example shows how to add annotations, such as marked rectangles, to a map.  Left click to add a polygon, right click to add a rectangle."
+    "text": "This example shows how to add annotations, such as marked rectangles, to a map."
   }
 }

examples/annotations/index.jade

@@ -6,13 +6,15 @@ block append mainContent
       .shortlabel Add
       button#rectangle.lastused(next='polygon') Rectangle
       button#polygon(next='point') Polygon
-      button#point(next='rectangle') Point
+      button#point(next='line') Point
+      button#line(next='rectangle') Line
     .form-group
       #instructions(annotation='none')
         .annotation.none
         .annotation.polygon Left-click points in the polygon.  Double click, right click, or click the starting point to close the polygon.
-        .annotation.rectangle Left click-and-drag to draw a rectangle.
+        .annotation.rectangle Left click-and-drag or left click opposite corners to draw a rectangle.
         .annotation.point Left click to create a point.
+        .annotation.line Left-click points in the line.  Double click, right click, or click the starting point to end the line.
     .form-group(title='If enabled, left-click to add another annotation, and right-click to switch annotation type.  Otherwise, you must click a button above.')
       label(for='clickadd') Click to add annotation
       input#clickadd(param-name='clickadd', type='checkbox', placeholder='true', checked='checked')
@@ -64,15 +66,33 @@ block append mainContent
             select#edit-stroke(option='stroke', format='boolean')
               option(value='true') Yes
               option(value='false') No
-          .form-group(annotation-types='point polygon rectangle')
+          .form-group(annotation-types='point polygon rectangle line')
             label(for='edit-strokeWidth') Stroke Width
             input#edit-strokeWidth(option='strokeWidth', format='positive')
-          .form-group(annotation-types='point polygon rectangle')
+          .form-group(annotation-types='point polygon rectangle line')
             label(for='edit-strokeColor') Stroke Color
             input#edit-strokeColor(option='strokeColor', format='color')
-          .form-group(annotation-types='point polygon rectangle')
+          .form-group(annotation-types='point polygon rectangle line')
             label(for='edit-strokeOpacity') Stroke Opacity
             input#edit-strokeOpacity(option='strokeOpacity', format='opacity')
+          .form-group(annotation-types='line')
+            label(for='edit-closed') Closed
+            select#edit-closed(option='closed', format='boolean')
+              option(value='true') Yes
+              option(value='false') No
+          .form-group(annotation-types='line')
+            label(for='edit-lineCap') Line End Caps
+            select#edit-lineCap(option='lineCap', format='text')
+              option(value='butt') Butt
+              option(value='round') Round
+              option(value='square') Square
+          .form-group(annotation-types='line')
+            label(for='edit-lineJoin') Line Joins
+            select#edit-lineJoin(option='lineJoin', format='text')
+              option(value='miter') Miter
+              option(value='bevel') Bevel
+              option(value='round') Round
+              option(value='miter-clip') Miter-Clip
           .form-group
             #edit-validation-error
         .modal-footer

examples/annotations/main.css

@@ -54,6 +54,7 @@
 #instructions[annotation="polygon"] .annotation.polygon,
 #instructions[annotation="rectangle"] .annotation.rectangle,
 #instructions[annotation="point"] .annotation.point,
+#instructions[annotation="line"] .annotation.line,
 #instructions[annotation="none"] .annotation.none {
   display: block;
 }

examples/lines/main.js

@@ -347,8 +347,10 @@ $(function () {
     .position(function (d) {
       return {x: d[0], y: d[1]};
     })
-    // add hover events
-    .geoOn(geo.event.feature.mouseover, function (evt) {
+    // add hover events -- use mouseon and mouseoff, since we only show one
+    // tootip.  If we showed one tooltip per item we were over, use mouseover
+    // and mouseout.
+    .geoOn(geo.event.feature.mouseon, function (evt) {
       var text = (evt.data.name ? evt.data.name : '') +
                  (evt.data.highway ? ' (' + evt.data.highway + ')' : '');
       if (text) {
@@ -357,7 +359,7 @@ $(function () {
       }
       tooltipElem.toggleClass('hidden', !text);
     })
-    .geoOn(geo.event.feature.mouseout, function (evt) {
+    .geoOn(geo.event.feature.mouseoff, function (evt) {
       tooltipElem.addClass('hidden');
     });
 

src/action.js

@@ -15,6 +15,7 @@ var geo_action = {
   zoomselect: 'geo_action_zoomselect',
 
   // annotation actions
+  annotation_line: 'geo_annotation_line',
   annotation_polygon: 'geo_annotation_polygon',
   annotation_rectangle: 'geo_annotation_rectangle'
 };