[Mapbender-commits] r8915 - in trunk/mapbender: http/plugins lib
svn_mapbender at osgeo.org
svn_mapbender at osgeo.org
Wed May 28 01:23:51 PDT 2014
Author: hwbllmnn
Date: 2014-05-28 01:23:51 -0700 (Wed, 28 May 2014)
New Revision: 8915
Modified:
trunk/mapbender/http/plugins/mb_digitize_widget.php
trunk/mapbender/lib/mb.ui.displayKmlFeatures.js
Log:
added icon picking for marker styles, extended marker style dialog
Modified: trunk/mapbender/http/plugins/mb_digitize_widget.php
===================================================================
--- trunk/mapbender/http/plugins/mb_digitize_widget.php 2014-05-28 08:23:16 UTC (rev 8914)
+++ trunk/mapbender/http/plugins/mb_digitize_widget.php 2014-05-28 08:23:51 UTC (rev 8915)
@@ -118,7 +118,7 @@
'<tr><td>Flächendeckkraft:</td><td><div class="opacity-slider" data-name="fill-opacity"></div></td></tr></table>' +
'<table class="digitize-style-predefined"><tr><td>Symbol:</td><td><input type="text" name="marker-symbol" value=""></input></td></tr>' +
'<tr><td>Symbolgröße:</td><td><input type="text" name="marker-size" value=""></input></td></tr>' +
- '<tr><td>Symbolfarbe:</td><td><input type="color" name="marker-color" value=""></input></td></tr>' +
+ '<tr><td>Symbolfarbe:</td><td><input type="color" name="marker-color" value="#ff0000"></input></td></tr>' +
'<tr><td>Linienfarbe</td><td><input type="color" name="stroke" value="#000000"></input></td></tr>' +
'<tr><td>Liniendeckkraft:</td><td><div class="opacity-slider" data-name="stroke-opacity"></div></td></tr>' +
'<tr><td>Liniendicke:</td><td><input type="text" name="stroke-width" value="1"></input></td></tr>' +
@@ -159,6 +159,7 @@
editDialog,
attributesDialog,
editStyleDialog,
+ icons = null,
button,
that = this,
inProgress = false,
@@ -168,6 +169,17 @@
status = 'none';
var create = function() {
+ $.ajax({
+ url: '../extensions/makiicons/selection.json',
+ type: 'GET',
+ dataType: 'json',
+ success: function(data) {
+ icons = data;
+ var kml = $('#mapframe1').data('kml');
+ kml.icons = icons;
+ }
+ });
+
//
// Initialise digitize dialog
//
@@ -247,6 +259,23 @@
};
var editStyle = function($link, menu) {
+ var classPrefix = icons.preferences.fontPref.prefix,
+ iconList = [],
+ search = [];
+
+ // For each icon
+ $.each(icons.icons, function(i, v) {
+ iconList.push( classPrefix + v.properties.name );
+
+ if ( v.icon && v.icon.tags && v.icon.tags.length ) {
+ search.push( v.properties.name + ' ' + v.icon.tags.join(' ') );
+ } else {
+ search.push( v.properties.name );
+ }
+ });
+
+ editStyleDialog.find('.digitize-style-predefined input[name="marker-symbol"]').fontIconPicker({source: iconList, searchSource: search, emptyIcon: false});
+
return function() {
editStyleDialog.dialog('open');
var idx = $link.attr('idx');
@@ -325,7 +354,7 @@
preview = editDialog.find('.digitize-preview').html('').get(0);
kml.renderPreview(feature, preview);
preview = attributesDialog.find('.digitize-preview').html('').get(0);
- kml.renderPreview(feature, preview);
+ kml.renderPreview(feature, preview);
});
$('.opacity-slider').slider('option', 'change', function() {
if(isline && $(this).attr('data-name') === 'fill-opacity') {
@@ -342,6 +371,7 @@
});
editStyleDialog.find('input[name="fill"]').spectrum();
editStyleDialog.find('input[name="stroke"]').spectrum();
+ editStyleDialog.find('input[name="marker-color"]').spectrum();
if(menu)
menu.menu('destroy').remove();
};
Modified: trunk/mapbender/lib/mb.ui.displayKmlFeatures.js
===================================================================
--- trunk/mapbender/lib/mb.ui.displayKmlFeatures.js 2014-05-28 08:23:16 UTC (rev 8914)
+++ trunk/mapbender/lib/mb.ui.displayKmlFeatures.js 2014-05-28 08:23:51 UTC (rev 8915)
@@ -353,14 +353,11 @@
feature.properties['marker-type'] = 'custom';
feature.properties['Mapbender:icon'] = null;
}
- if(feature.properties['marker-symbol']) {
+ if(feature.properties['marker-type'] === 'custom') {
var size = 32;
- if(feature.properties['marker-size'] === 'small') {
- size = 20;
+ if(feature.properties['marker-size']) {
+ size = feature.properties['marker-size'];
}
- if(feature.properties['marker-size'] === 'large') {
- size = 64;
- }
if(feature.preview) {
size = 20;
}
@@ -369,7 +366,66 @@
img.setAttributeNS(null, "preserveAspectRatio" , "xMidYMid meet" );
}
} else {
- canvas.circle(pt.x, pt.y, 32).attr(feature.attributes);
+ var size = 32;
+ if(feature.properties['marker-size']) {
+ if(feature.properties['marker-size'] === 'large') {
+ size = 64;
+ }
+ if(feature.properties['marker-size'] === 'small') {
+ size = 16;
+ }
+ }
+ if(feature.preview) {
+ size = 20;
+ }
+
+ if(!this.icons) {
+ window.setTimeout($.proxy(function(){
+ this.renderPoint(canvas, feature);
+ }, this), 100);
+ return;
+ }
+
+ $.each(this.icons.icons, function(_, v) {
+ if('icon-' + v.properties.name === feature.properties['marker-symbol']) {
+ $.each(v.icon.paths, function(_, p) {
+ var raph = Raphael();
+ var tmp = raph.path(p);
+ var box = tmp.getBBox();
+ tmp.remove();
+ $(raph.canvas).remove();
+ var path = canvas.path(p);
+
+ var fac;
+ if(box.width > box.height) {
+ fac = size / box.width;
+ } else {
+ fac = size / box.height;
+ }
+
+ if(feature.preview) {
+ fac = fac * 0.7;
+ }
+
+ // center icon on 0/0, then scale to size, then translate to actual point
+ // for preview, just start at 0/0
+ if(feature.preview) {
+ path.translate(-box.x, -box.y);
+ } else {
+ path.translate(-box.x - box.width / 2, -box.y - box.height / 2);
+ }
+ // if you get a chrome error 'Invalid value for <path> attribute transform=" "' see:
+ // http://forum.wakanda.org/showthread.php?6753-error-raphael-min.js-7&p=31624&viewfull=1
+ path.scale(fac, fac, 0, 0);
+ if(!feature.preview) {
+ path.translate(pt.x, pt.y);
+ }
+
+ path.attr('fill', feature.properties['marker-color']);
+ path.attr('stroke', 'black');
+ });
+ }
+ });
}
},
@@ -415,20 +471,24 @@
renderFeature: function(canvas) {
var self = this;
return function(_, feature) {
- if(feature.display === false) {
- return;
+ try{
+ if(feature.display === false) {
+ return;
+ }
+ switch(feature.geometry.type.toLowerCase()) {
+ case 'point':
+ self.renderPoint(canvas, feature);
+ break;
+ case 'linestring':
+ self.renderLine(canvas, feature);
+ break;
+ case 'polygon':
+ self.renderPolygon(canvas, feature);
+ break;
+ };
+ }catch(e) {
+ console && console.log('Problem rendering feature', feature, e)
}
- switch(feature.geometry.type.toLowerCase()) {
- case 'point':
- self.renderPoint(canvas, feature);
- break;
- case 'linestring':
- self.renderLine(canvas, feature);
- break;
- case 'polygon':
- self.renderPolygon(canvas, feature);
- break;
- };
}
},
More information about the Mapbender_commits
mailing list