mirror of
https://github.com/Viglino/ol-ext.git
synced 2026-01-25 17:36:21 +00:00
117 lines
3.8 KiB
JavaScript
117 lines
3.8 KiB
JavaScript
/* Copyright (c) 2015 Jean-Marc VIGLINO,
|
|
released under the CeCILL-B license (French BSD license)
|
|
(http://www.cecill.info/licences/Licence_CeCILL-B_V1-en.txt).
|
|
*/
|
|
/**
|
|
* @classdesc
|
|
* OpenLayers 3 Attribution Control integrated in the canvas (for jpeg/png export purposes).
|
|
* @see http://www.kreidefossilien.de/webgis/dokumentation/beispiele/export-map-to-png-with-scale
|
|
*
|
|
* @constructor
|
|
* @extends {ol.control.Attribution}
|
|
* @param {Object=} Control options. The style {ol.style.Style} option is usesd to draw the text.
|
|
*/
|
|
ol.control.CanvasAttribution = function(options)
|
|
{ if (!options) options = {};
|
|
ol.control.Attribution.call(this, options);
|
|
|
|
// Draw in canvas
|
|
this.isCanvas_ = !!options.canvas;
|
|
|
|
// Get style options
|
|
if (!options) options={};
|
|
if (!options.style) options.style = new ol.style.Style();
|
|
this.setStyle (options.style);
|
|
}
|
|
ol.inherits(ol.control.CanvasAttribution, ol.control.Attribution);
|
|
|
|
/**
|
|
* Draw attribution on canvas
|
|
* @param {boolean} draw the attribution on canvas.
|
|
*/
|
|
ol.control.CanvasAttribution.prototype.setCanvas = function (b)
|
|
{ this.isCanvas_ = b;
|
|
$(this.element).css("visibility", b ? "hidden":"visible");
|
|
if (this.map_) this.map_.renderSync();
|
|
}
|
|
|
|
/**
|
|
* Change the control style
|
|
* @param {ol.style.Style}
|
|
*/
|
|
ol.control.CanvasAttribution.prototype.setStyle = function (style)
|
|
{ var text = style.getText();
|
|
this.font_ = text ? text.getFont() : "10px Arial";
|
|
var stroke = text ? text.getStroke() : null;
|
|
var fill = text ? text.getFill() : null;
|
|
this.fontStrokeStyle_ = stroke ? ol.color.asString(stroke.getColor()) : "#fff";
|
|
this.fontFillStyle_ = fill ? ol.color.asString(fill.getColor()) : "#000";
|
|
this.fontStrokeWidth_ = stroke ? stroke.getWidth() : 3;
|
|
if (this.getMap()) this.getMap().render();
|
|
}
|
|
|
|
/**
|
|
* Remove the control from its current map and attach it to the new map.
|
|
* Subclasses may set up event handlers to get notified about changes to
|
|
* the map here.
|
|
* @param {ol.Map} map Map.
|
|
* @api stable
|
|
*/
|
|
ol.control.CanvasAttribution.prototype.setMap = function (map)
|
|
{ var oldmap = this.getMap();
|
|
if (oldmap) oldmap.un('postcompose', this.drawAttribution_, this);
|
|
|
|
ol.control.ScaleLine.prototype.setMap.call(this, map);
|
|
if (oldmap) oldmap.renderSync();
|
|
|
|
// Get change (new layer added or removed)
|
|
if (map) map.on('postcompose', this.drawAttribution_, this);
|
|
this.map_ = map;
|
|
|
|
this.setCanvas (this.isCanvas_);
|
|
}
|
|
|
|
/**
|
|
* Draw attribution in the final canvas
|
|
* @private
|
|
*/
|
|
ol.control.CanvasAttribution.prototype.drawAttribution_ = function(e)
|
|
{ var ctx = e.context;
|
|
if (!this.isCanvas_) return;
|
|
|
|
var text = "";
|
|
$("li", this.element).each (function()
|
|
{ if ($(this).css("display")!="none") text += (text ? " - ":"") + $(this).text();
|
|
});
|
|
|
|
// Get size of the scale div
|
|
var position = $(this.element).position();
|
|
// Retina device
|
|
var ratio = e.frameState.pixelRatio;
|
|
ctx.save();
|
|
ctx.scale(ratio,ratio);
|
|
|
|
// Position if transform:scale()
|
|
var container = $(this.getMap().getViewport()).parent();
|
|
var scx = container.outerWidth() / container.get(0).getBoundingClientRect().width;
|
|
var scy = container.outerHeight() / container.get(0).getBoundingClientRect().height;
|
|
position.left *= scx;
|
|
position.top *= scy;
|
|
|
|
position.right = position.left + $(this.element).outerWidth();
|
|
position.bottom = position.top + $(this.element).outerHeight();
|
|
|
|
// Draw scale text
|
|
ctx.beginPath();
|
|
ctx.strokeStyle = this.fontStrokeStyle_;
|
|
ctx.fillStyle = this.fontFillStyle_;
|
|
ctx.lineWidth = this.fontStrokeWidth_;
|
|
ctx.textAlign = "right";
|
|
ctx.textBaseline ="bottom";
|
|
ctx.font = this.font_;
|
|
ctx.strokeText(text, position.right, position.bottom);
|
|
ctx.fillText(text, position.right, position.bottom);
|
|
ctx.closePath();
|
|
|
|
ctx.restore();
|
|
} |