Mercurial > hg > digilib

changeset 1267:9c09ab5b46ec

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
added Polygon and LineString aka polylline shape rendering. no creation yet.
author robcast
date Wed, 22 Jan 2014 20:11:36 +0100
parents 52aeee70d2af
children 0b04336453cb
files webapp/src/main/webapp/jquery/digilib-vector.html webapp/src/main/webapp/jquery/jquery.digilib.vector.js
diffstat 2 files changed, 75 insertions(+), 0 deletions(-) [+]
line wrap: on
line diff
--- a/webapp/src/main/webapp/jquery/digilib-vector.html	Wed Jan 22 10:40:17 2014 +0100
+++ b/webapp/src/main/webapp/jquery/digilib-vector.html	Wed Jan 22 20:11:36 2014 +0100
@@ -53,6 +53,15 @@
                         'editable' : true
                     },
                     'id' : 'myBestRect'
+                },{
+                    'geometry' : {
+                        'type' : 'LineString',
+                        'coordinates' : [[0.5, 0.5], [0.7, 0.5], [0.6, 0.6]]
+                    },
+                    'properties' : {
+                        'stroke' : 'green',
+                        'editable' : true
+                    }
                 }]);
                 $('#test-squares')[0].addEventListener('load', function (evt) {
                     var layer = {'projection': 'relative', 
--- a/webapp/src/main/webapp/jquery/jquery.digilib.vector.js	Wed Jan 22 10:40:17 2014 +0100
+++ b/webapp/src/main/webapp/jquery/jquery.digilib.vector.js	Wed Jan 22 20:11:36 2014 +0100
@@ -377,6 +377,66 @@
                 $e1.one("mousedown.dlVertexDrag", getVertexDragHandler(data, shape, 0));
                 $e2.one("mousedown.dlVertexDrag", getVertexDragHandler(data, shape, 1));
             }
+        } else if (gt === 'Polygon') {
+            /*
+             * Polygon
+             */
+            var ps = [];
+            for (var i in coords) {
+                ps[i] = trafo.transform(geom.position(coords[i]));
+            }
+            var $elem = $(svgElement('polygon', {
+                'id': id,
+                'points': ps.join(" "),
+                'stroke': stroke, 'stroke-width': strokeWidth,
+                'fill': fill}));
+            shape.$elem = $elem;
+            $svg.append($elem);
+            if (props.editable) {
+                var $vertexElems = [];
+                shape.$vertexElems = $vertexElems;
+                for (var i in ps) {
+                    var p = ps[i];
+                    var $vertexElem = $(svgElement('rect', {
+                        'x': p.x-hs/2, 'y': p.y-hs/2, 'width': hs, 'height': hs,
+                        'stroke': 'darkgrey', 'stroke-width': 1, 'fill': 'none',
+                        'class': css+'svg-handle', 'style': 'pointer-events:all'}));
+                    $vertexElems[i] = $vertexElem;
+                    // getVertexDragHandler needs shape.$vertexElems
+                    $vertexElem.one("mousedown.dlVertexDrag", getVertexDragHandler(data, shape, i));
+                }
+                $svg.append($vertexElems);
+            }
+        } else if (gt === 'LineString') {
+            /*
+             * Polyline
+             */
+            var ps = [];
+            for (var i in coords) {
+                ps[i] = trafo.transform(geom.position(coords[i]));
+            }
+            var $elem = $(svgElement('polyline', {
+                'id': id,
+                'points': ps.join(" "),
+                'stroke': stroke, 'stroke-width': strokeWidth,
+                'fill': 'none'}));
+            shape.$elem = $elem;
+            $svg.append($elem);
+            if (props.editable) {
+                var $vertexElems = [];
+                shape.$vertexElems = $vertexElems;
+                for (var i in ps) {
+                    var p = ps[i];
+                    var $vertexElem = $(svgElement('rect', {
+                        'x': p.x-hs/2, 'y': p.y-hs/2, 'width': hs, 'height': hs,
+                        'stroke': 'darkgrey', 'stroke-width': 1, 'fill': 'none',
+                        'class': css+'svg-handle', 'style': 'pointer-events:all'}));
+                    $vertexElems[i] = $vertexElem;
+                    // getVertexDragHandler needs shape.$vertexElems
+                    $vertexElem.one("mousedown.dlVertexDrag", getVertexDragHandler(data, shape, i));
+                }
+                $svg.append($vertexElems);
+            }
         }
     };
 
@@ -431,6 +491,12 @@
                 }
                 $shape.attr({'x': rect.x, 'y': rect.y,
                     'width': rect.width, 'height': rect.height});               
+            } else if (shapeType === 'Polygon' || shapeType === 'LineString' ) {
+                var points = $shape.attr('points');
+                var ps = points.split(' ');
+                ps[vtx] = pt.x + ',' + pt.y;
+                points = ps.join(' ');
+                $shape.attr('points', points);
             }
             return false;
         };