ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge pull request #1586 from twpayne/text

Browse Source 
Add text rendering
This commit is contained in:
Tom Payne
2014-02-03 08:37:50 -08:00
parent 8731766f63 1f4ab82210
commit b567b888b0
19 changed files with 1257 additions and 485 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
examples/vector-layer.js
View File

@@ -9,24 +9,39 @@ goog.require('ol.source.MapQuest');
goog.require('ol.style.Fill');
goog.require('ol.style.Stroke');
goog.require('ol.style.Style');
goog.require('ol.style.Text');
var styleArray = [new ol.style.Style({
fill: new ol.style.Fill({
color: 'rgba(255, 255, 255, 0.6)'
}),
stroke: new ol.style.Stroke({
color: '#319FD3',
width: 1
})
})];
var styleCache = {};
var vectorLayer = new ol.layer.Vector({
source: new ol.source.GeoJSON({
url: 'data/geojson/countries.geojson'
}),
styleFunction: function(feature, resolution) {
return styleArray;
var text = resolution < 5000 ? feature.get('name') : '';
if (!styleCache[text]) {
styleCache[text] = [new ol.style.Style({
fill: new ol.style.Fill({
color: 'rgba(255, 255, 255, 0.6)'
}),
stroke: new ol.style.Stroke({
color: '#319FD3',
width: 1
}),
text: new ol.style.Text({
font: '12px Calibri,sans-serif',
text: text,
fill: new ol.style.Fill({
color: '#000'
}),
stroke: new ol.style.Stroke({
color: '#fff',
width: 3
})
})
})];
}
return styleCache[text];
}
});
@@ -45,20 +60,35 @@ var map = new ol.Map({
})
});
var highlightStyleArray = [new ol.style.Style({
stroke: new ol.style.Stroke({
color: '#f00',
width: 1
}),
fill: new ol.style.Fill({
color: 'rgba(255,0,0,0.1)'
})
})];
var highlightStyleCache = {};
var featuresOverlay = new ol.render.FeaturesOverlay({
map: map,
styleFunction: function(feature, resolution) {
return highlightStyleArray;
var text = resolution < 5000 ? feature.get('name') : '';
if (!highlightStyleCache[text]) {
highlightStyleCache[text] = [new ol.style.Style({
stroke: new ol.style.Stroke({
color: '#f00',
width: 1
}),
fill: new ol.style.Fill({
color: 'rgba(255,0,0,0.1)'
}),
text: new ol.style.Text({
font: '12px Calibri,sans-serif',
text: text,
fill: new ol.style.Fill({
color: '#000'
}),
stroke: new ol.style.Stroke({
color: '#f00',
width: 3
})
})
})];
}
return highlightStyleCache[text];
}
});

1
src/objectliterals.jsdoc
View File

@@ -943,6 +943,7 @@
/**
* @typedef {Object} olx.style.TextOptions
* @property {string|undefined} font Font.
* @property {number|undefined} scale Scale.
* @property {number|undefined} rotation Rotation.
* @property {string|undefined} text Text.
* @property {string|undefined} textAlign Text alignment.

18
src/ol/extent.js
View File

@@ -216,14 +216,17 @@ ol.extent.createOrUpdateFromCoordinates = function(coordinates, opt_extent) {
/**
* @param {Array.<number>} flatCoordinates Flat coordinates.
* @param {number} offset Offset.
* @param {number} end End.
* @param {number} stride Stride.
* @param {ol.Extent=} opt_extent Extent.
* @return {ol.Extent} Extent.
*/
ol.extent.createOrUpdateFromFlatCoordinates =
function(flatCoordinates, stride, opt_extent) {
function(flatCoordinates, offset, end, stride, opt_extent) {
var extent = ol.extent.createOrUpdateEmpty(opt_extent);
return ol.extent.extendFlatCoordinates(extent, flatCoordinates, stride);
return ol.extent.extendFlatCoordinates(
extent, flatCoordinates, offset, end, stride);
};
@@ -324,13 +327,16 @@ ol.extent.extendCoordinates = function(extent, coordinates) {
/**
* @param {ol.Extent} extent Extent.
* @param {Array.<number>} flatCoordinates Flat coordinates.
* @param {number} offset Offset.
* @param {number} end End.
* @param {number} stride Stride.
* @return {ol.Extent} Extent.
*/
ol.extent.extendFlatCoordinates = function(extent, flatCoordinates, stride) {
var i, ii;
for (i = 0, ii = flatCoordinates.length; i < ii; i += stride) {
ol.extent.extendXY(extent, flatCoordinates[i], flatCoordinates[i + 1]);
ol.extent.extendFlatCoordinates =
function(extent, flatCoordinates, offset, end, stride) {
for (; offset < end; offset += stride) {
ol.extent.extendXY(
extent, flatCoordinates[offset], flatCoordinates[offset + 1]);
}
return extent;
};

125
src/ol/geom/flatgeom.js
View File

@@ -4,6 +4,7 @@ goog.require('goog.array');
goog.require('goog.asserts');
goog.require('goog.math');
goog.require('goog.vec.Mat4');
goog.require('ol.extent');
/**
@@ -247,23 +248,25 @@ ol.geom.flat.inflateCoordinatesss =
* @param {number} end End.
* @param {number} stride Stride.
* @param {number} fraction Fraction.
* @param {ol.Coordinate=} opt_point Point.
* @return {ol.Coordinate} Point at fraction along the line string.
* @param {Array.<number>=} opt_dest Destination.
* @return {Array.<number>} Destination.
*/
ol.geom.flat.lineStringInterpolate =
function(flatCoordinates, offset, end, stride, fraction, opt_point) {
function(flatCoordinates, offset, end, stride, fraction, opt_dest) {
// FIXME interpolate extra dimensions
goog.asserts.assert(0 <= fraction && fraction <= 1);
var point = goog.isDef(opt_point) ? opt_point : [NaN, NaN];
var pointX = NaN;
var pointY = NaN;
var n = (end - offset) / stride;
if (n === 0) {
goog.asserts.fail();
} else if (n == 1) {
point[0] = flatCoordinates[offset];
point[1] = flatCoordinates[offset + 1];
pointX = flatCoordinates[offset];
pointY = flatCoordinates[offset + 1];
} else if (n == 2) {
point[0] = (1 - fraction) * flatCoordinates[offset] +
pointX = (1 - fraction) * flatCoordinates[offset] +
fraction * flatCoordinates[offset + stride];
point[1] = (1 - fraction) * flatCoordinates[offset + 1] +
pointY = (1 - fraction) * flatCoordinates[offset + 1] +
fraction * flatCoordinates[offset + stride + 1];
} else {
var x1 = flatCoordinates[offset];
@@ -285,15 +288,20 @@ ol.geom.flat.lineStringInterpolate =
var t = (target - cumulativeLengths[-index - 2]) /
(cumulativeLengths[-index - 1] - cumulativeLengths[-index - 2]);
var o = offset + (-index - 2) * stride;
point[0] = (1 - t) * flatCoordinates[o] + t * flatCoordinates[o + stride];
point[1] = (1 - t) * flatCoordinates[o + 1] +
pointX = (1 - t) * flatCoordinates[o] + t * flatCoordinates[o + stride];
pointY = (1 - t) * flatCoordinates[o + 1] +
t * flatCoordinates[o + stride + 1];
} else {
point[0] = flatCoordinates[offset + index * stride];
point[1] = flatCoordinates[offset + index * stride + 1];
pointX = flatCoordinates[offset + index * stride];
pointY = flatCoordinates[offset + index * stride + 1];
}
}
return point;
if (goog.isDefAndNotNull(opt_dest)) {
opt_dest.push(pointX, pointY);
return opt_dest;
} else {
return [pointX, pointY];
}
};
@@ -397,25 +405,6 @@ ol.geom.flat.linearRingIsClockwise =
};
/**
* @param {Array.<number>} flatCoordinates Flat coordinates.
* @param {number} offset Offset.
* @param {number} end End.
* @param {number} stride Stride.
* @return {number} Mid Y.
*/
ol.geom.flat.linearRingMidY = function(flatCoordinates, offset, end, stride) {
var minY = Infinity;
var maxY = -Infinity;
for (; offset < end; offset += stride) {
var y = flatCoordinates[offset + 1];
minY = Math.min(minY, y);
maxY = Math.max(maxY, y);
}
return (minY + maxY) / 2;
};
/**
* @param {Array.<number>} flatCoordinates Flat coordinates.
* @param {number} offset Offset.
@@ -484,21 +473,21 @@ ol.geom.flat.linearRingsContainsXY =
/**
* Calculates a point that is guaranteed to lie in the interior of the linear
* rings.
* Calculates a point that is likely to lie in the interior of the linear rings.
* Inspired by JTS's com.vividsolutions.jts.geom.Geometry#getInteriorPoint.
* @param {Array.<number>} flatCoordinates Flat coordinates.
* @param {number} offset Offset.
* @param {Array.<number>} ends Ends.
* @param {number} stride Stride.
* @param {number} y Y.
* @param {Array.<number>=} opt_point Point.
* @return {Array.<number>} A point which is in the interior of the linear
* rings.
* @param {Array.<number>} flatCenters Flat centers.
* @param {number} flatCentersOffset Flat center offset.
* @param {Array.<number>=} opt_dest Destination.
* @return {Array.<number>} Destination.
*/
ol.geom.flat.linearRingsGetInteriorPoint =
function(flatCoordinates, offset, ends, stride, y, opt_point) {
ol.geom.flat.linearRingsGetInteriorPoint = function(flatCoordinates, offset,
ends, stride, flatCenters, flatCentersOffset, opt_dest) {
var i, ii, x, x1, x2, y1, y2;
var y = flatCenters[flatCentersOffset + 1];
/** @type {Array.<number>} */
var intersections = [];
// Calculate intersections with the horizontal line
@@ -516,15 +505,8 @@ ol.geom.flat.linearRingsGetInteriorPoint =
y1 = y2;
}
// Find the longest segment of the horizontal line that has its center point
// inside the polygon
var point;
if (goog.isDef(opt_point)) {
point = opt_point;
point[0] = NaN;
point[1] = y;
} else {
point = [NaN, y];
}
// inside the linear ring.
var pointX = NaN;
var maxSegmentLength = -Infinity;
intersections.sort();
x1 = intersections[0];
@@ -535,14 +517,23 @@ ol.geom.flat.linearRingsGetInteriorPoint =
x = (x1 + x2) / 2;
if (ol.geom.flat.linearRingsContainsXY(
flatCoordinates, offset, ends, stride, x, y)) {
point[0] = x;
pointX = x;
maxSegmentLength = segmentLength;
}
}
x1 = x2;
}
goog.asserts.assert(!isNaN(point[0]));
return point;
if (isNaN(pointX)) {
// There is no horizontal line that has its center point inside the linear
// ring. Use the center of the the linear ring's extent.
pointX = flatCenters[flatCentersOffset];
}
if (goog.isDef(opt_dest)) {
opt_dest.push(pointX, y);
return opt_dest;
} else {
return [pointX, y];
}
};
@@ -644,21 +635,21 @@ ol.geom.flat.linearRingssContainsXY =
* @param {number} offset Offset.
* @param {Array.<Array.<number>>} endss Endss.
* @param {number} stride Stride.
* @param {Array.<number>} ys Ys.
* @return {Array.<ol.Coordinate>} Mid Ys.
* @param {Array.<number>} flatCenters Flat centers.
* @return {Array.<number>} Interior points.
*/
ol.geom.flat.linearRingssGetInteriorPoints =
function(flatCoordinates, offset, endss, stride, ys) {
goog.asserts.assert(endss.length == ys.length);
var points = [];
function(flatCoordinates, offset, endss, stride, flatCenters) {
goog.asserts.assert(2 * endss.length == flatCenters.length);
var interiorPoints = [];
var i, ii;
for (i = 0, ii = endss.length; i < ii; ++i) {
var ends = endss[i];
points.push(ol.geom.flat.linearRingsGetInteriorPoint(
flatCoordinates, offset, ends, stride, ys[i]));
interiorPoints = ol.geom.flat.linearRingsGetInteriorPoint(flatCoordinates,
offset, ends, stride, flatCenters, 2 * i, interiorPoints);
offset = ends[ends.length - 1];
}
return points;
return interiorPoints;
};
@@ -667,19 +658,21 @@ ol.geom.flat.linearRingssGetInteriorPoints =
* @param {number} offset Offset.
* @param {Array.<Array.<number>>} endss Endss.
* @param {number} stride Stride.
* @return {Array.<number>} Mid Ys.
* @return {Array.<number>} Flat centers.
*/
ol.geom.flat.linearRingssMidYs =
ol.geom.flat.linearRingssGetFlatCenters =
function(flatCoordinates, offset, endss, stride) {
var midYs = [];
var flatCenters = [];
var i, ii;
var extent = ol.extent.createEmpty();
for (i = 0, ii = endss.length; i < ii; ++i) {
var ends = endss[i];
midYs.push(
ol.geom.flat.linearRingMidY(flatCoordinates, offset, ends[0], stride));
extent = ol.extent.createOrUpdateFromFlatCoordinates(
flatCoordinates, offset, ends[0], stride);
flatCenters.push((extent[0] + extent[2]) / 2, (extent[1] + extent[3]) / 2);
offset = ends[ends.length - 1];
}
return midYs;
return flatCenters;
};

26
src/ol/geom/linestring.js
View File

@@ -20,6 +20,18 @@ ol.geom.LineString = function(coordinates, opt_layout) {
goog.base(this);
/**
* @private
* @type {ol.Coordinate}
*/
this.flatMidpoint_ = null;
/**
* @private
* @type {number}
*/
this.flatMidpointRevision_ = -1;
/**
* @private
* @type {number}
@@ -88,6 +100,20 @@ ol.geom.LineString.prototype.getLength = function() {
};
/**
* @return {Array.<number>} Flat midpoint.
*/
ol.geom.LineString.prototype.getFlatMidpoint = function() {
if (this.flatMidpointRevision_ != this.getRevision()) {
this.flatMidpoint_ = ol.geom.flat.lineStringInterpolate(
this.flatCoordinates, 0, this.flatCoordinates.length, this.stride,
0.5, this.flatMidpoint_);
this.flatMidpointRevision_ = this.getRevision();
}
return this.flatMidpoint_;
};
/**
* @inheritDoc
*/

21
src/ol/geom/multilinestring.js
View File

@@ -112,6 +112,27 @@ ol.geom.MultiLineString.prototype.getLineStrings = function() {
};
/**
* @return {Array.<number>} Flat midpoints.
*/
ol.geom.MultiLineString.prototype.getFlatMidpoints = function() {
var midpoints = [];
var flatCoordinates = this.flatCoordinates;
var offset = 0;
var ends = this.ends_;
var stride = this.stride;
var i, ii;
for (i = 0, ii = ends.length; i < ii; ++i) {
var end = ends[i];
var midpoint = ol.geom.flat.lineStringInterpolate(
flatCoordinates, offset, end, stride, 0.5);
goog.array.extend(midpoints, midpoint);
offset = end;
}
return midpoints;
};
/**
* @inheritDoc
*/

23
src/ol/geom/multipolygon.js
View File

@@ -31,13 +31,13 @@ ol.geom.MultiPolygon = function(coordinates, opt_layout) {
* @private
* @type {number}
*/
this.interiorPointsRevision_ = -1;
this.flatInteriorPointsRevision_ = -1;
/**
* @private
* @type {Array.<ol.Coordinate>}
* @type {Array.<number>}
*/
this.interiorPoints_ = null;
this.flatInteriorPoints_ = null;
/**
* @private
@@ -138,17 +138,18 @@ ol.geom.MultiPolygon.prototype.getEndss = function() {
/**
* @return {Array.<ol.Coordinate>} Interior points.
* @return {Array.<number>} Flat interior points.
*/
ol.geom.MultiPolygon.prototype.getInteriorPoints = function() {
if (this.interiorPointsRevision_ != this.getRevision()) {
var ys = ol.geom.flat.linearRingssMidYs(
ol.geom.MultiPolygon.prototype.getFlatInteriorPoints = function() {
if (this.flatInteriorPointsRevision_ != this.getRevision()) {
var flatCenters = ol.geom.flat.linearRingssGetFlatCenters(
this.flatCoordinates, 0, this.endss_, this.stride);
this.interiorPoints_ = ol.geom.flat.linearRingssGetInteriorPoints(
this.getOrientedFlatCoordinates(), 0, this.endss_, this.stride, ys);
this.interiorPointsRevision_ = this.getRevision();
this.flatInteriorPoints_ = ol.geom.flat.linearRingssGetInteriorPoints(
this.getOrientedFlatCoordinates(), 0, this.endss_, this.stride,
flatCenters);
this.flatInteriorPointsRevision_ = this.getRevision();
}
return this.interiorPoints_;
return this.flatInteriorPoints_;
};

22
src/ol/geom/polygon.js
View File

@@ -31,13 +31,13 @@ ol.geom.Polygon = function(coordinates, opt_layout) {
* @private
* @type {number}
*/
this.interiorPointRevision_ = -1;
this.flatInteriorPointRevision_ = -1;
/**
* @private
* @type {ol.Coordinate}
*/
this.interiorPoint_ = null;
this.flatInteriorPoint_ = null;
/**
* @private
@@ -138,17 +138,17 @@ ol.geom.Polygon.prototype.getEnds = function() {
/**
* @return {ol.Coordinate} Interior point.
* @return {Array.<number>} Interior point.
*/
ol.geom.Polygon.prototype.getInteriorPoint = function() {
if (this.interiorPointRevision_ != this.getRevision()) {
var extent = this.getExtent();
var y = (extent[1] + extent[3]) / 2;
this.interiorPoint_ = ol.geom.flat.linearRingsGetInteriorPoint(
this.getOrientedFlatCoordinates(), 0, this.ends_, this.stride, y);
this.interiorPointRevision_ = this.getRevision();
ol.geom.Polygon.prototype.getFlatInteriorPoint = function() {
if (this.flatInteriorPointRevision_ != this.getRevision()) {
var flatCenter = ol.extent.getCenter(this.getExtent());
this.flatInteriorPoint_ = ol.geom.flat.linearRingsGetInteriorPoint(
this.getOrientedFlatCoordinates(), 0, this.ends_, this.stride,
flatCenter, 0);
this.flatInteriorPointRevision_ = this.getRevision();
}
return this.interiorPoint_;
return this.flatInteriorPoint_;
};

3
src/ol/geom/simplegeometry.js
View File

@@ -90,7 +90,8 @@ ol.geom.SimpleGeometry.prototype.containsXY = goog.functions.FALSE;
ol.geom.SimpleGeometry.prototype.getExtent = function(opt_extent) {
if (this.extentRevision != this.getRevision()) {
this.extent = ol.extent.createOrUpdateFromFlatCoordinates(
this.flatCoordinates, this.stride, this.extent);
this.flatCoordinates, 0, this.flatCoordinates.length, this.stride,
this.extent);
this.extentRevision = this.getRevision();
}
goog.asserts.assert(goog.isDef(this.extent));

31
src/ol/render/canvas/canvas.js
View File

@@ -3,6 +3,31 @@ goog.provide('ol.render.canvas');
goog.require('ol.color');
/**
* @typedef {{fillStyle: string}}
*/
ol.render.canvas.FillState;
/**
* @typedef {{lineCap: string,
* lineDash: Array.<number>,
* lineJoin: string,
* lineWidth: number,
* miterLimit: number,
* strokeStyle: string}}
*/
ol.render.canvas.StrokeState;
/**
* @typedef {{font: string,
* textAlign: string,
* textBaseline: string}}
*/
ol.render.canvas.TextState;
/**
* @const
* @type {string}
@@ -49,21 +74,21 @@ ol.render.canvas.defaultMiterLimit = 10;
* @const
* @type {ol.Color}
*/
ol.render.canvas.defaultStrokeStyle = ol.color.fromString('black');
ol.render.canvas.defaultStrokeStyle = [0, 0, 0, 1];
/**
* @const
* @type {string}
*/
ol.render.canvas.defaultTextAlign = 'start';
ol.render.canvas.defaultTextAlign = 'center';
/**
* @const
* @type {string}
*/
ol.render.canvas.defaultTextBaseline = 'alphabetic';
ol.render.canvas.defaultTextBaseline = 'middle';
/**

779
src/ol/render/canvas/canvasimmediate.js
View File

@@ -1,6 +1,6 @@
// FIXME test, especially polygons with holes and multipolygons
// FIXME need to handle large thick features (where pixel size matters)
// FIXME store raw style values for text
// FIXME add offset and end to ol.geom.flat.transform2D?
goog.provide('ol.render.canvas.Immediate');
@@ -10,9 +10,9 @@ goog.require('goog.object');
goog.require('goog.vec.Mat4');
goog.require('ol.color');
goog.require('ol.extent');
goog.require('ol.geom.flat');
goog.require('ol.render.IRender');
goog.require('ol.render.canvas');
goog.require('ol.style.Text');
goog.require('ol.vec.Mat4');
@@ -61,55 +61,117 @@ ol.render.canvas.Immediate = function(context, pixelRatio, extent, transform) {
/**
* @private
* @type {{currentFillStyle: (string|undefined),
* currentStrokeStyle: (string|undefined),
* currentLineCap: (string|undefined),
* currentLineDash: Array.<number>,
* currentLineJoin: (string|undefined),
* currentLineWidth: (number|undefined),
* currentMiterLimit: (number|undefined),
* fillStyle: (string|undefined),
* strokeStyle: (string|undefined),
* lineWidth: (number|undefined),
* image: (HTMLCanvasElement|HTMLVideoElement|Image),
* anchorX: (number|undefined),
* anchorY: (number|undefined),
* height: (number|undefined),
* width: (number|undefined),
* scale: number,
* rotation: number,
* lineCap: (string|undefined),
* lineDash: Array.<number>,
* lineJoin: (string|undefined),
* miterLimit: (number|undefined),
* snapToPixel: (boolean|undefined),
* textStyle: ol.style.Text}}
* @type {?ol.render.canvas.FillState}
*/
this.state_ = {
currentFillStyle: undefined,
currentStrokeStyle: undefined,
currentLineCap: undefined,
currentLineDash: null,
currentLineJoin: undefined,
currentLineWidth: undefined,
currentMiterLimit: undefined,
fillStyle: undefined,
strokeStyle: undefined,
lineWidth: undefined,
image: null,
anchorX: undefined,
anchorY: undefined,
height: undefined,
rotation: 0,
scale: 1,
width: undefined,
lineCap: undefined,
lineDash: null,
lineJoin: undefined,
miterLimit: undefined,
snapToPixel: undefined,
textStyle: null
};
this.contextFillState_ = null;
/**
* @private
* @type {?ol.render.canvas.StrokeState}
*/
this.contextStrokeState_ = null;
/**
* @private
* @type {?ol.render.canvas.TextState}
*/
this.contextTextState_ = null;
/**
* @private
* @type {?ol.render.canvas.FillState}
*/
this.fillState_ = null;
/**
* @private
* @type {?ol.render.canvas.StrokeState}
*/
this.strokeState_ = null;
/**
* @private
* @type {HTMLCanvasElement|HTMLVideoElement|Image}
*/
this.image_ = null;
/**
* @private
* @type {number}
*/
this.imageAnchorX_ = 0;
/**
* @private
* @type {number}
*/
this.imageAnchorY_ = 0;
/**
* @private
* @type {number}
*/
this.imageHeight_ = 0;
/**
* @private
* @type {number}
*/
this.imageRotation_ = 0;
/**
* @private
* @type {number}
*/
this.imageScale_ = 0;
/**
* @private
* @type {boolean}
*/
this.imageSnapToPixel_ = false;
/**
* @private
* @type {number}
*/
this.imageWidth_ = 0;
/**
* @private
* @type {string}
*/
this.text_ = '';
/**
* @private
* @type {number}
*/
this.textRotation_ = 0;
/**
* @private
* @type {number}
*/
this.textScale_ = 0;
/**
* @private
* @type {?ol.render.canvas.FillState}
*/
this.textFillState_ = null;
/**
* @private
* @type {?ol.render.canvas.StrokeState}
*/
this.textStrokeState_ = null;
/**
* @private
* @type {?ol.render.canvas.TextState}
*/
this.textState_ = null;
/**
* @private
@@ -127,37 +189,37 @@ ol.render.canvas.Immediate = function(context, pixelRatio, extent, transform) {
/**
* @param {ol.geom.Point|ol.geom.MultiPoint} geometry Geometry.
* @param {Array.<number>} flatCoordinates Flat coordinates.
* @param {number} offset Offset.
* @param {number} end End.
* @param {number} stride Stride.
* @private
*/
ol.render.canvas.Immediate.prototype.drawImages_ = function(geometry) {
var state = this.state_;
var context = this.context_;
if (!ol.extent.intersects(this.extent_, geometry.getExtent()) ||
goog.isNull(state.image)) {
ol.render.canvas.Immediate.prototype.drawImages_ =
function(flatCoordinates, offset, end, stride) {
if (goog.isNull(this.image_)) {
return;
}
goog.asserts.assert(goog.isDef(state.anchorX));
goog.asserts.assert(goog.isDef(state.anchorY));
goog.asserts.assert(goog.isDef(state.height));
goog.asserts.assert(goog.isDef(state.width));
var pixelCoordinates = ol.geom.transformSimpleGeometry2D(
geometry, this.transform_, this.pixelCoordinates_);
goog.asserts.assert(offset === 0);
goog.asserts.assert(end == flatCoordinates.length);
var pixelCoordinates = ol.geom.flat.transform2D(
flatCoordinates, 2, this.transform_, this.pixelCoordinates_);
var context = this.context_;
var localTransform = this.tmpLocalTransform_;
var i, ii;
for (i = 0, ii = pixelCoordinates.length; i < ii; i += 2) {
var x = pixelCoordinates[i] - state.anchorX;
var y = pixelCoordinates[i + 1] - state.anchorY;
if (state.snapToPixel) {
var x = pixelCoordinates[i] - this.imageAnchorX_;
var y = pixelCoordinates[i + 1] - this.imageAnchorY_;
if (this.imageSnapToPixel_) {
x = (x + 0.5) | 0;
y = (y + 0.5) | 0;
}
if (state.scale != 1 || state.rotation !== 0) {
var centerX = x + state.anchorX;
var centerY = y + state.anchorY;
if (this.imageRotation_ !== 0 || this.imageScale_ != 1) {
var centerX = x + this.imageAnchorX_;
var centerY = y + this.imageAnchorY_;
ol.vec.Mat4.makeTransform2D(localTransform,
centerX, centerY, state.scale, state.scale,
state.rotation, -centerX, -centerY);
centerX, centerY, this.imageScale_, this.imageScale_,
this.imageRotation_, -centerX, -centerY);
context.setTransform(
goog.vec.Mat4.getElement(localTransform, 0, 0),
goog.vec.Mat4.getElement(localTransform, 1, 0),
@@ -166,43 +228,60 @@ ol.render.canvas.Immediate.prototype.drawImages_ = function(geometry) {
goog.vec.Mat4.getElement(localTransform, 0, 3),
goog.vec.Mat4.getElement(localTransform, 1, 3));
}
context.drawImage(state.image, x, y, state.width, state.height);
context.drawImage(this.image_, x, y, this.imageWidth_, this.imageHeight_);
}
if (state.scale != 1 || state.rotation !== 0) {
if (this.imageRotation_ !== 0 || this.imageScale_ != 1) {
context.setTransform(1, 0, 0, 1, 0, 0);
}
};
/**
* @param {ol.geom.Point|ol.geom.MultiPoint} geometry Geometry.
* @param {Array.<number>} flatCoordinates Flat coordinates.
* @param {number} offset Offset.
* @param {number} end End.
* @param {number} stride Stride.
* @private
*/
ol.render.canvas.Immediate.prototype.drawText_ = function(geometry) {
var context = this.context_;
var state = this.state_;
var fillStyle = state.fillStyle;
var strokeStyle = state.strokeStyle;
var textStyle = state.textStyle;
if (!ol.extent.intersects(this.extent_, geometry.getExtent()) ||
!goog.isDefAndNotNull(textStyle) || !goog.isDef(textStyle.text) ||
(!goog.isDef(fillStyle) && !goog.isDef(strokeStyle))) {
ol.render.canvas.Immediate.prototype.drawText_ =
function(flatCoordinates, offset, end, stride) {
if (goog.isNull(this.textState_) || this.text_ === '') {
return;
}
this.setFillStrokeStyles_();
var pixelCoordinates = ol.geom.transformSimpleGeometry2D(
geometry, this.transform_, this.pixelCoordinates_);
var i, ii;
for (i = 0, ii = pixelCoordinates.length; i < ii; i += 2) {
var x = pixelCoordinates[i];
var y = pixelCoordinates[i + 1];
// FIXME stroke before fill or fill before stroke?
if (goog.isDef(strokeStyle)) {
context.strokeText(textStyle.text, x, y);
if (!goog.isNull(this.textFillState_)) {
this.setContextFillState_(this.textFillState_);
}
if (!goog.isNull(this.textStrokeState_)) {
this.setContextStrokeState_(this.textStrokeState_);
}
goog.asserts.assert(offset === 0);
goog.asserts.assert(end == flatCoordinates.length);
var pixelCoordinates = ol.geom.flat.transform2D(
flatCoordinates, stride, this.transform_, this.pixelCoordinates_);
var context = this.context_;
for (; offset < end; offset += stride) {
var x = pixelCoordinates[offset];
var y = pixelCoordinates[offset + 1];
if (this.textRotation_ !== 0 || this.textScale_ != 1) {
var localTransform = ol.vec.Mat4.makeTransform2D(this.tmpLocalTransform_,
x, y, this.textScale_, this.textScale_, this.textRotation_, -x, -y);
context.setTransform(
goog.vec.Mat4.getElement(localTransform, 0, 0),
goog.vec.Mat4.getElement(localTransform, 1, 0),
goog.vec.Mat4.getElement(localTransform, 0, 1),
goog.vec.Mat4.getElement(localTransform, 1, 1),
goog.vec.Mat4.getElement(localTransform, 0, 3),
goog.vec.Mat4.getElement(localTransform, 1, 3));
}
if (goog.isDef(fillStyle)) {
context.fillText(textStyle.text, x, y);
if (!goog.isNull(this.textStrokeState_)) {
context.strokeText(this.text_, x, y);
}
if (!goog.isNull(this.textFillState_)) {
context.fillText(this.text_, x, y);
}
}
if (this.textRotation_ !== 0 || this.textScale_ != 1) {
context.setTransform(1, 0, 0, 1, 0, 0);
}
};
@@ -271,25 +350,31 @@ ol.render.canvas.Immediate.prototype.drawCircleGeometry =
if (!ol.extent.intersects(this.extent_, circleGeometry.getExtent())) {
return;
}
var state = this.state_;
if (!goog.isDef(state.fillStyle) && !goog.isDef(state.strokeStyle)) {
return;
if (!goog.isNull(this.fillState_) || !goog.isNull(this.strokeState_)) {
if (!goog.isNull(this.fillState_)) {
this.setContextFillState_(this.fillState_);
}
if (!goog.isNull(this.strokeState_)) {
this.setContextStrokeState_(this.strokeState_);
}
var pixelCoordinates = ol.geom.transformSimpleGeometry2D(
circleGeometry, this.transform_, this.pixelCoordinates_);
var dx = pixelCoordinates[2] - pixelCoordinates[0];
var dy = pixelCoordinates[3] - pixelCoordinates[1];
var radius = Math.sqrt(dx * dx + dy * dy);
var context = this.context_;
context.beginPath();
context.arc(
pixelCoordinates[0], pixelCoordinates[1], radius, 0, 2 * Math.PI);
if (!goog.isNull(this.fillState_)) {
context.fill();
}
if (!goog.isNull(this.strokeState_)) {
context.stroke();
}
}
this.setFillStrokeStyles_();
var context = this.context_;
var pixelCoordinates = ol.geom.transformSimpleGeometry2D(
circleGeometry, this.transform_, this.pixelCoordinates_);
var dx = pixelCoordinates[2] - pixelCoordinates[0];
var dy = pixelCoordinates[3] - pixelCoordinates[1];
var radius = Math.sqrt(dx * dx + dy * dy);
context.beginPath();
context.arc(pixelCoordinates[0], pixelCoordinates[1], radius, 0, 2 * Math.PI);
if (goog.isDef(state.fillStyle)) {
context.fill();
}
if (goog.isDef(state.strokeStyle)) {
goog.asserts.assert(goog.isDef(state.lineWidth));
context.stroke();
if (this.text_ !== '') {
this.drawText_(circleGeometry.getCenter(), 0, 2, 2);
}
};
@@ -310,6 +395,7 @@ ol.render.canvas.Immediate.prototype.drawFeature = function(feature, style) {
this.drawAsync(zIndex, function(render) {
render.setFillStrokeStyle(style.getFill(), style.getStroke());
render.setImageStyle(style.getImage());
render.setTextStyle(style.getText());
var renderGeometry =
ol.render.canvas.Immediate.GEOMETRY_RENDERES_[geometry.getType()];
goog.asserts.assert(goog.isDef(renderGeometry));
@@ -340,8 +426,14 @@ ol.render.canvas.Immediate.prototype.drawGeometryCollectionGeometry =
*/
ol.render.canvas.Immediate.prototype.drawPointGeometry =
function(pointGeometry, data) {
this.drawImages_(pointGeometry);
this.drawText_(pointGeometry);
var flatCoordinates = pointGeometry.getFlatCoordinates();
var stride = pointGeometry.getStride();
if (!goog.isNull(this.image_)) {
this.drawImages_(flatCoordinates, 0, flatCoordinates.length, stride);
}
if (this.text_ !== '') {
this.drawImages_(flatCoordinates, 0, flatCoordinates.length, stride);
}
};
@@ -350,8 +442,14 @@ ol.render.canvas.Immediate.prototype.drawPointGeometry =
*/
ol.render.canvas.Immediate.prototype.drawMultiPointGeometry =
function(multiPointGeometry, data) {
this.drawImages_(multiPointGeometry);
this.drawText_(multiPointGeometry);
var flatCoordinates = multiPointGeometry.getFlatCoordinates();
var stride = multiPointGeometry.getStride();
if (!goog.isNull(this.image_)) {
this.drawImages_(flatCoordinates, 0, flatCoordinates.length, stride);
}
if (this.text_ !== '') {
this.drawText_(flatCoordinates, 0, flatCoordinates.length, stride);
}
};
@@ -360,17 +458,22 @@ ol.render.canvas.Immediate.prototype.drawMultiPointGeometry =
*/
ol.render.canvas.Immediate.prototype.drawLineStringGeometry =
function(lineStringGeometry, data) {
if (!ol.extent.intersects(this.extent_, lineStringGeometry.getExtent()) ||
!goog.isDef(this.state_.strokeStyle)) {
if (!ol.extent.intersects(this.extent_, lineStringGeometry.getExtent())) {
return;
}
this.setFillStrokeStyles_();
var context = this.context_;
var pixelCoordinates = ol.geom.transformSimpleGeometry2D(
lineStringGeometry, this.transform_, this.pixelCoordinates_);
context.beginPath();
this.moveToLineTo_(pixelCoordinates, 0, pixelCoordinates.length, false);
context.stroke();
if (!goog.isNull(this.strokeState_)) {
this.setContextStrokeState_(this.strokeState_);
var pixelCoordinates = ol.geom.transformSimpleGeometry2D(
lineStringGeometry, this.transform_, this.pixelCoordinates_);
var context = this.context_;
context.beginPath();
this.moveToLineTo_(pixelCoordinates, 0, pixelCoordinates.length, false);
context.stroke();
}
if (this.text_ !== '') {
var flatMidpoint = lineStringGeometry.getFlatMidpoint();
this.drawText_(flatMidpoint, 0, 2, 2);
}
};
@@ -380,22 +483,28 @@ ol.render.canvas.Immediate.prototype.drawLineStringGeometry =
ol.render.canvas.Immediate.prototype.drawMultiLineStringGeometry =
function(multiLineStringGeometry, data) {
var geometryExtent = multiLineStringGeometry.getExtent();
if (!ol.extent.intersects(this.extent_, geometryExtent) ||
!goog.isDef(this.state_.strokeStyle)) {
if (!ol.extent.intersects(this.extent_, geometryExtent)) {
return;
}
this.setFillStrokeStyles_();
var context = this.context_;
var pixelCoordinates = ol.geom.transformSimpleGeometry2D(
multiLineStringGeometry, this.transform_, this.pixelCoordinates_);
context.beginPath();
var ends = multiLineStringGeometry.getEnds();
var offset = 0;
var i, ii;
for (i = 0, ii = ends.length; i < ii; ++i) {
offset = this.moveToLineTo_(pixelCoordinates, offset, ends[i], false);
var pixelCoordinates;
if (!goog.isNull(this.strokeState_)) {
this.setContextStrokeState_(this.strokeState_);
pixelCoordinates = ol.geom.transformSimpleGeometry2D(
multiLineStringGeometry, this.transform_, this.pixelCoordinates_);
var context = this.context_;
context.beginPath();
var ends = multiLineStringGeometry.getEnds();
var offset = 0;
var i, ii;
for (i = 0, ii = ends.length; i < ii; ++i) {
offset = this.moveToLineTo_(pixelCoordinates, offset, ends[i], false);
}
context.stroke();
}
if (this.text_ !== '') {
var flatMidpoints = multiLineStringGeometry.getFlatMidpoints();
this.drawText_(flatMidpoints, 0, flatMidpoints.length, 2);
}
context.stroke();
};
@@ -407,23 +516,29 @@ ol.render.canvas.Immediate.prototype.drawPolygonGeometry =
if (!ol.extent.intersects(this.extent_, polygonGeometry.getExtent())) {
return;
}
var state = this.state_;
if (!goog.isDef(state.fillStyle) && !goog.isDef(state.strokeStyle)) {
return;
var pixelCoordinates;
if (!goog.isNull(this.strokeState_) || !goog.isNull(this.fillState_)) {
if (!goog.isNull(this.fillState_)) {
this.setContextFillState_(this.fillState_);
}
if (!goog.isNull(this.strokeState_)) {
this.setContextStrokeState_(this.strokeState_);
}
pixelCoordinates = ol.geom.transformSimpleGeometry2D(
polygonGeometry, this.transform_, this.pixelCoordinates_);
var context = this.context_;
context.beginPath();
this.drawRings_(pixelCoordinates, 0, polygonGeometry.getEnds());
if (!goog.isNull(this.fillState_)) {
context.fill();
}
if (!goog.isNull(this.strokeState_)) {
context.stroke();
}
}
this.setFillStrokeStyles_();
var context = this.context_;
var pixelCoordinates = ol.geom.transformSimpleGeometry2D(
polygonGeometry, this.transform_, this.pixelCoordinates_);
var ends = polygonGeometry.getEnds();
context.beginPath();
this.drawRings_(pixelCoordinates, 0, ends);
if (goog.isDef(state.fillStyle)) {
context.fill();
}
if (goog.isDef(state.strokeStyle)) {
goog.asserts.assert(goog.isDef(state.lineWidth));
context.stroke();
if (this.text_ !== '') {
var flatInteriorPoint = polygonGeometry.getFlatInteriorPoint();
this.drawText_(flatInteriorPoint, 0, 2, 2);
}
};
@@ -436,32 +551,45 @@ ol.render.canvas.Immediate.prototype.drawMultiPolygonGeometry =
if (!ol.extent.intersects(this.extent_, multiPolygonGeometry.getExtent())) {
return;
}
var state = this.state_;
if (!goog.isDef(state.fillStyle) && !goog.isDef(state.strokeStyle)) {
return;
var pixelCoordinates;
if (!goog.isNull(this.strokeState_) || !goog.isNull(this.fillState_)) {
if (!goog.isNull(this.fillState_)) {
this.setContextFillState_(this.fillState_);
}
if (!goog.isNull(this.strokeState_)) {
this.setContextStrokeState_(this.strokeState_);
}
pixelCoordinates = ol.geom.transformSimpleGeometry2D(
multiPolygonGeometry, this.transform_, this.pixelCoordinates_);
var context = this.context_;
var endss = multiPolygonGeometry.getEndss();
var offset = 0;
var i, ii;
for (i = 0, ii = endss.length; i < ii; ++i) {
var ends = endss[i];
context.beginPath();
offset = this.drawRings_(pixelCoordinates, offset, ends);
if (!goog.isNull(this.fillState_)) {
context.fill();
}
if (!goog.isNull(this.strokeState_)) {
context.stroke();
}
}
}
this.setFillStrokeStyles_();
var context = this.context_;
var pixelCoordinates = ol.geom.transformSimpleGeometry2D(
multiPolygonGeometry, this.transform_, this.pixelCoordinates_);
var endss = multiPolygonGeometry.getEndss();
var offset = 0;
var i, ii;
for (i = 0, ii = endss.length; i < ii; ++i) {
var ends = endss[i];
context.beginPath();
offset = this.drawRings_(pixelCoordinates, offset, ends);
if (goog.isDef(state.fillStyle)) {
context.fill();
}
if (goog.isDef(state.strokeStyle)) {
goog.asserts.assert(goog.isDef(state.lineWidth));
context.stroke();
}
if (this.text_ !== '') {
var flatInteriorPoints = multiPolygonGeometry.getFlatInteriorPoints();
this.drawText_(flatInteriorPoints, 0, flatInteriorPoints.length, 2);
}
};
/**
* @inheritDoc
*/
ol.render.canvas.Immediate.prototype.drawText = goog.abstractMethod;
/**
* FIXME: empty description for jsdoc
*/
@@ -480,86 +608,143 @@ ol.render.canvas.Immediate.prototype.flush = function() {
/**
* @inheritDoc
* @param {ol.render.canvas.FillState} fillState Fill state.
* @private
*/
ol.render.canvas.Immediate.prototype.setFillStrokeStyle =
function(fillStyle, strokeStyle) {
var state = this.state_;
if (!goog.isNull(fillStyle)) {
var fillStyleColor = fillStyle.getColor();
state.fillStyle = ol.color.asString(!goog.isNull(fillStyleColor) ?
fillStyleColor : ol.render.canvas.defaultFillStyle);
ol.render.canvas.Immediate.prototype.setContextFillState_ =
function(fillState) {
var context = this.context_;
var contextFillState = this.contextFillState_;
if (goog.isNull(contextFillState)) {
context.fillStyle = fillState.fillStyle;
this.contextFillState_ = {
fillStyle: fillState.fillStyle
};
} else {
state.fillStyle = undefined;
}
if (!goog.isNull(strokeStyle)) {
var strokeStyleColor = strokeStyle.getColor();
state.strokeStyle = ol.color.asString(!goog.isNull(strokeStyleColor) ?
strokeStyleColor : ol.render.canvas.defaultStrokeStyle);
var strokeStyleLineCap = strokeStyle.getLineCap();
state.lineCap = goog.isDef(strokeStyleLineCap) ?
strokeStyleLineCap : ol.render.canvas.defaultLineCap;
var strokeStyleLineDash = strokeStyle.getLineDash();
state.lineDash = !goog.isNull(strokeStyleLineDash) ?
strokeStyleLineDash : ol.render.canvas.defaultLineDash;
var strokeStyleLineJoin = strokeStyle.getLineJoin();
state.lineJoin = goog.isDef(strokeStyleLineJoin) ?
strokeStyleLineJoin : ol.render.canvas.defaultLineJoin;
var strokeStyleWidth = strokeStyle.getWidth();
state.lineWidth = this.pixelRatio_ * (goog.isDef(strokeStyleWidth) ?
strokeStyleWidth : ol.render.canvas.defaultLineWidth);
var strokeStyleMiterLimit = strokeStyle.getMiterLimit();
state.miterLimit = goog.isDef(strokeStyleMiterLimit) ?
strokeStyleMiterLimit : ol.render.canvas.defaultMiterLimit;
} else {
state.strokeStyle = undefined;
state.lineCap = undefined;
state.lineDash = null;
state.lineJoin = undefined;
state.lineWidth = undefined;
state.miterLimit = undefined;
if (contextFillState.fillStyle != fillState.fillStyle) {
contextFillState.fillStyle = context.fillStyle = fillState.fillStyle;
}
}
};
/**
* @param {ol.render.canvas.StrokeState} strokeState Stroke state.
* @private
*/
ol.render.canvas.Immediate.prototype.setFillStrokeStyles_ = function() {
var state = this.state_;
ol.render.canvas.Immediate.prototype.setContextStrokeState_ =
function(strokeState) {
var context = this.context_;
var fillStyle = state.fillStyle;
var strokeStyle = state.strokeStyle;
var lineCap = state.lineCap;
var lineDash = state.lineDash;
var lineJoin = state.lineJoin;
var lineWidth = state.lineWidth;
var miterLimit = state.miterLimit;
if (goog.isDef(fillStyle) && state.currentFillStyle != fillStyle) {
context.fillStyle = fillStyle;
state.currentFillStyle = fillStyle;
}
if (goog.isDef(strokeStyle)) {
goog.asserts.assert(goog.isDef(lineWidth));
goog.asserts.assert(goog.isDef(lineCap));
goog.asserts.assert(!goog.isNull(lineDash));
goog.asserts.assert(goog.isDef(lineJoin));
goog.asserts.assert(goog.isDef(miterLimit));
if (state.currentStrokeStyle != strokeStyle ||
state.currentLineCap != lineCap ||
state.currentLineDash != lineDash ||
state.currentLineJoin != lineJoin ||
state.currentMiterLimit != miterLimit ||
state.currentLineWidth != lineWidth) {
context.strokeStyle = strokeStyle;
context.lineCap = lineCap;
if (goog.isDef(context.setLineDash)) {
context.setLineDash(lineDash);
}
context.lineJoin = lineJoin;
context.miterLimit = miterLimit;
context.lineWidth = lineWidth;
var contextStrokeState = this.contextStrokeState_;
if (goog.isNull(contextStrokeState)) {
context.lineCap = strokeState.lineCap;
context.lineDash = strokeState.lineDash;
context.lineJoin = strokeState.lineJoin;
context.lineWidth = strokeState.lineWidth;
context.miterLimit = strokeState.miterLimit;
context.strokeStyle = strokeState.strokeStyle;
this.contextStrokeState_ = {
lineCap: strokeState.lineCap,
lineDash: strokeState.lineDash,
lineJoin: strokeState.lineJoin,
lineWidth: strokeState.lineWidth,
miterLimit: strokeState.miterLimit,
strokeStyle: strokeState.strokeStyle
};
} else {
if (contextStrokeState.lineCap != strokeState.lineCap) {
contextStrokeState.lineCap = context.lineCap = strokeState.lineCap;
}
if (contextStrokeState.lineDash != strokeState.lineDash) {
contextStrokeState.lineDash = context.lineDash = strokeState.lineDash;
}
if (contextStrokeState.lineJoin != strokeState.lineJoin) {
contextStrokeState.lineJoin = context.lineJoin = strokeState.lineJoin;
}
if (contextStrokeState.lineWidth != strokeState.lineWidth) {
contextStrokeState.lineWidth = context.lineWidth = strokeState.lineWidth;
}
if (contextStrokeState.miterLimit != strokeState.miterLimit) {
contextStrokeState.miterLimit = context.miterLimit =
strokeState.miterLimit;
}
if (contextStrokeState.strokeStyle != strokeState.strokeStyle) {
contextStrokeState.strokeStyle = context.strokeStyle =
strokeState.strokeStyle;
}
}
};
/**
* @param {ol.render.canvas.TextState} textState Text state.
* @private
*/
ol.render.canvas.Immediate.prototype.setContextTextState_ =
function(textState) {
var context = this.context_;
var contextTextState = this.contextTextState_;
if (goog.isNull(contextTextState)) {
context.font = textState.font;
context.textAlign = textState.textAlign;
context.textBaseline = textState.textBaseline;
this.contextTextState_ = {
font: textState.font,
textAlign: textState.textAlign,
textBaseline: textState.textBaseline
};
} else {
if (contextTextState.font != textState.font) {
contextTextState.font = context.font = textState.font;
}
if (contextTextState.textAlign != textState.textAlign) {
contextTextState.textAlign = context.textAlign = textState.textAlign;
}
if (contextTextState.textBaseline != textState.textBaseline) {
contextTextState.textBaseline = context.textBaseline =
textState.textBaseline;
}
}
};
/**
* @inheritDoc
*/
ol.render.canvas.Immediate.prototype.setFillStrokeStyle =
function(fillStyle, strokeStyle) {
if (goog.isNull(fillStyle)) {
this.fillState_ = null;
} else {
var fillStyleColor = fillStyle.getColor();
this.fillState_ = {
fillStyle: ol.color.asString(!goog.isNull(fillStyleColor) ?
fillStyleColor : ol.render.canvas.defaultFillStyle)
};
}
if (goog.isNull(strokeStyle)) {
this.strokeState_ = null;
} else {
var strokeStyleColor = strokeStyle.getColor();
var strokeStyleLineCap = strokeStyle.getLineCap();
var strokeStyleLineDash = strokeStyle.getLineDash();
var strokeStyleLineJoin = strokeStyle.getLineJoin();
var strokeStyleWidth = strokeStyle.getWidth();
var strokeStyleMiterLimit = strokeStyle.getMiterLimit();
this.strokeState_ = {
lineCap: goog.isDef(strokeStyleLineCap) ?
strokeStyleLineCap : ol.render.canvas.defaultLineCap,
lineDash: goog.isDef(strokeStyleLineDash) ?
strokeStyleLineDash : ol.render.canvas.defaultLineDash,
lineJoin: goog.isDef(strokeStyleLineJoin) ?
strokeStyleLineJoin : ol.render.canvas.defaultLineJoin,
lineWidth: this.pixelRatio_ * (goog.isDef(strokeStyleWidth) ?
strokeStyleWidth : ol.render.canvas.defaultLineWidth),
miterLimit: goog.isDef(strokeStyleMiterLimit) ?
strokeStyleMiterLimit : ol.render.canvas.defaultMiterLimit,
strokeStyle: ol.color.asString(!goog.isNull(strokeStyleColor) ?
strokeStyleColor : ol.render.canvas.defaultStrokeStyle)
};
}
};
@@ -568,23 +753,28 @@ ol.render.canvas.Immediate.prototype.setFillStrokeStyles_ = function() {
* @inheritDoc
*/
ol.render.canvas.Immediate.prototype.setImageStyle = function(imageStyle) {
if (!goog.isNull(imageStyle)) {
var anchor = imageStyle.getAnchor();
goog.asserts.assert(!goog.isNull(anchor));
var size = imageStyle.getSize();
goog.asserts.assert(!goog.isNull(size));
if (goog.isNull(imageStyle)) {
this.image_ = null;
} else {
var imageAnchor = imageStyle.getAnchor();
// FIXME pixel ratio
var image = imageStyle.getImage(1);
goog.asserts.assert(!goog.isNull(image));
var state = this.state_;
state.image = image;
state.anchorX = anchor[0];
state.anchorY = anchor[1];
state.height = size[1];
state.rotation = imageStyle.getRotation();
state.scale = imageStyle.getScale();
state.snapToPixel = imageStyle.getSnapToPixel();
state.width = size[0];
var imageImage = imageStyle.getImage(1);
var imageRotation = imageStyle.getRotation();
var imageScale = imageStyle.getScale();
var imageSize = imageStyle.getSize();
var imageSnapToPixel = imageStyle.getSnapToPixel();
goog.asserts.assert(!goog.isNull(imageAnchor));
goog.asserts.assert(!goog.isNull(imageImage));
goog.asserts.assert(!goog.isNull(imageSize));
this.imageAnchorX_ = imageAnchor[0];
this.imageAnchorY_ = imageAnchor[1];
this.imageHeight_ = imageSize[1];
this.image_ = imageImage;
this.imageRotation_ = goog.isDef(imageRotation) ? imageRotation : 0;
this.imageScale_ = goog.isDef(imageScale) ? imageScale : 1;
this.imageSnapToPixel_ = goog.isDef(imageSnapToPixel) ?
imageSnapToPixel : false;
this.imageWidth_ = imageSize[0];
}
};
@@ -593,21 +783,62 @@ ol.render.canvas.Immediate.prototype.setImageStyle = function(imageStyle) {
* @inheritDoc
*/
ol.render.canvas.Immediate.prototype.setTextStyle = function(textStyle) {
var context = this.context_;
var state = this.state_;
if (!ol.style.Text.equals(state.textStyle, textStyle)) {
if (goog.isDefAndNotNull(textStyle)) {
var textStyleFont = textStyle.getFont();
context.font = goog.isDef(textStyleFont) ?
textStyleFont : ol.render.canvas.defaultFont;
var textStyleTextAlign = textStyle.getTextAlign();
context.textAlign = goog.isDef(textStyleTextAlign) ?
textStyleTextAlign : ol.render.canvas.defaultTextAlign;
var textStyleTextBaseline = textStyle.getTextBaseline();
context.textBaseline = goog.isDef(textStyleTextBaseline) ?
textStyleTextBaseline : ol.render.canvas.defaultTextBaseline;
if (goog.isNull(textStyle)) {
this.text_ = '';
} else {
var textFillStyle = textStyle.getFill();
if (goog.isNull(textFillStyle)) {
this.textFillState_ = null;
} else {
var textFillStyleColor = textFillStyle.getColor();
this.textFillState_ = {
fillStyle: ol.color.asString(!goog.isNull(textFillStyleColor) ?
textFillStyleColor : ol.render.canvas.defaultFillStyle)
};
}
state.textStyle = textStyle;
var textStrokeStyle = textStyle.getStroke();
if (goog.isNull(textStrokeStyle)) {
this.textStrokeState_ = null;
} else {
var textStrokeStyleColor = textStrokeStyle.getColor();
var textStrokeStyleLineCap = textStrokeStyle.getLineCap();
var textStrokeStyleLineDash = textStrokeStyle.getLineDash();
var textStrokeStyleLineJoin = textStrokeStyle.getLineJoin();
var textStrokeStyleWidth = textStrokeStyle.getWidth();
var textStrokeStyleMiterLimit = textStrokeStyle.getMiterLimit();
this.textStrokeState_ = {
lineCap: goog.isDef(textStrokeStyleLineCap) ?
textStrokeStyleLineCap : ol.render.canvas.defaultLineCap,
lineDash: goog.isDef(textStrokeStyleLineDash) ?
textStrokeStyleLineDash : ol.render.canvas.defaultLineDash,
lineJoin: goog.isDef(textStrokeStyleLineJoin) ?
textStrokeStyleLineJoin : ol.render.canvas.defaultLineJoin,
lineWidth: this.pixelRatio_ * (goog.isDef(textStrokeStyleWidth) ?
textStrokeStyleWidth : ol.render.canvas.defaultLineWidth),
miterLimit: goog.isDef(textStrokeStyleMiterLimit) ?
textStrokeStyleMiterLimit : ol.render.canvas.defaultMiterLimit,
strokeStyle: ol.color.asString(!goog.isNull(textStrokeStyleColor) ?
textStrokeStyleColor : ol.render.canvas.defaultStrokeStyle)
};
}
var textFont = textStyle.getFont();
var textRotation = textStyle.getRotation();
var textScale = textStyle.getScale();
var textText = textStyle.getText();
var textTextAlign = textStyle.getTextAlign();
var textTextBaseline = textStyle.getTextBaseline();
this.textState_ = {
font: goog.isDef(textFont) ?
textFont : ol.render.canvas.defaultFont,
textAlign: goog.isDef(textTextAlign) ?
textTextAlign : ol.render.canvas.defaultTextAlign,
textBaseline: goog.isDef(textTextBaseline) ?
textTextBaseline : ol.render.canvas.defaultTextBaseline
};
this.text_ = goog.isDef(textText) ? textText : '';
this.textRotation_ = goog.isDef(textRotation) ? textRotation : 0;
this.textScale_ = this.pixelRatio_ * (goog.isDef(textScale) ?
textScale : 1);
}
};

378
src/ol/render/canvas/canvasreplay.js
View File

@@ -30,12 +30,14 @@ ol.render.canvas.Instruction = {
CIRCLE: 2,
CLOSE_PATH: 3,
DRAW_IMAGE: 4,
END_GEOMETRY: 5,
FILL: 6,
MOVE_TO_LINE_TO: 7,
SET_FILL_STYLE: 8,
SET_STROKE_STYLE: 9,
STROKE: 10
DRAW_TEXT: 5,
END_GEOMETRY: 6,
FILL: 7,
MOVE_TO_LINE_TO: 8,
SET_FILL_STYLE: 9,
SET_STROKE_STYLE: 10,
SET_TEXT_STYLE: 11,
STROKE: 12
};
@@ -185,7 +187,7 @@ ol.render.canvas.Replay.prototype.replay_ =
while (i < ii) {
var instruction = instructions[i];
var type = /** @type {ol.render.canvas.Instruction} */ (instruction[0]);
var geometry;
var fill, geometry, stroke, text, x, y;
switch (type) {
case ol.render.canvas.Instruction.BEGIN_GEOMETRY:
geometry = /** @type {ol.geom.Geometry} */ (instruction[1]);
@@ -231,8 +233,8 @@ ol.render.canvas.Replay.prototype.replay_ =
var snapToPixel = /** @type {boolean|undefined} */ (instruction[9]);
var width = /** @type {number} */ (instruction[10]) * pixelRatio;
for (; d < dd; d += 2) {
var x = pixelCoordinates[d] - anchorX;
var y = pixelCoordinates[d + 1] - anchorY;
x = pixelCoordinates[d] - anchorX;
y = pixelCoordinates[d + 1] - anchorY;
if (snapToPixel) {
x = (x + 0.5) | 0;
y = (y + 0.5) | 0;
@@ -258,6 +260,47 @@ ol.render.canvas.Replay.prototype.replay_ =
}
++i;
break;
case ol.render.canvas.Instruction.DRAW_TEXT:
goog.asserts.assert(goog.isNumber(instruction[1]));
d = /** @type {number} */ (instruction[1]);
goog.asserts.assert(goog.isNumber(instruction[2]));
dd = /** @type {number} */ (instruction[2]);
goog.asserts.assert(goog.isString(instruction[3]));
text = /** @type {string} */ (instruction[3]);
goog.asserts.assert(goog.isNumber(instruction[4]));
rotation = /** @type {number} */ (instruction[4]);
goog.asserts.assert(goog.isNumber(instruction[5]));
scale = /** @type {number} */ (instruction[5]) * pixelRatio;
goog.asserts.assert(goog.isBoolean(instruction[6]));
fill = /** @type {boolean} */ (instruction[6]);
goog.asserts.assert(goog.isBoolean(instruction[7]));
stroke = /** @type {boolean} */ (instruction[7]);
for (; d < dd; d += 2) {
x = pixelCoordinates[d];
y = pixelCoordinates[d + 1];
if (scale != 1 || rotation !== 0) {
ol.vec.Mat4.makeTransform2D(
localTransform, x, y, scale, scale, rotation, -x, -y);
context.setTransform(
goog.vec.Mat4.getElement(localTransform, 0, 0),
goog.vec.Mat4.getElement(localTransform, 1, 0),
goog.vec.Mat4.getElement(localTransform, 0, 1),
goog.vec.Mat4.getElement(localTransform, 1, 1),
goog.vec.Mat4.getElement(localTransform, 0, 3),
goog.vec.Mat4.getElement(localTransform, 1, 3));
}
if (stroke) {
context.strokeText(text, x, y);
}
if (fill) {
context.fillText(text, x, y);
}
if (scale != 1 || rotation !== 0) {
context.setTransform(1, 0, 0, 1, 0, 0);
}
}
++i;
break;
case ol.render.canvas.Instruction.END_GEOMETRY:
if (goog.isDef(geometryCallback)) {
geometry = /** @type {ol.geom.Geometry} */ (instruction[1]);
@@ -306,6 +349,15 @@ ol.render.canvas.Replay.prototype.replay_ =
}
++i;
break;
case ol.render.canvas.Instruction.SET_TEXT_STYLE:
goog.asserts.assert(goog.isString(instruction[1]));
goog.asserts.assert(goog.isString(instruction[2]));
goog.asserts.assert(goog.isString(instruction[3]));
context.font = /** @type {string} */ (instruction[1]);
context.textAlign = /** @type {string} */ (instruction[2]);
context.textBaseline = /** @type {string} */ (instruction[3]);
++i;
break;
case ol.render.canvas.Instruction.STROKE:
context.stroke();
++i;
@@ -449,6 +501,12 @@ ol.render.canvas.Replay.prototype.drawMultiPolygonGeometry =
goog.abstractMethod;
/**
* @inheritDoc
*/
ol.render.canvas.Replay.prototype.drawText = goog.abstractMethod;
/**
* @param {ol.geom.Geometry} geometry Geometry.
* @param {Object} data Opaque data object.
@@ -1255,6 +1313,305 @@ ol.render.canvas.PolygonReplay.prototype.setFillStrokeStyles_ = function() {
/**
* @constructor
* @extends {ol.render.canvas.Replay}
* @param {number} tolerance Tolerance.
* @protected
* @struct
*/
ol.render.canvas.TextReplay = function(tolerance) {
goog.base(this, tolerance);
/**
* @private
* @type {?ol.render.canvas.FillState}
*/
this.replayFillState_ = null;
/**
* @private
* @type {?ol.render.canvas.StrokeState}
*/
this.replayStrokeState_ = null;
/**
* @private
* @type {?ol.render.canvas.TextState}
*/
this.replayTextState_ = null;
/**
* @private
* @type {string}
*/
this.text_ = '';
/**
* @private
* @type {number}
*/
this.textRotation_ = 0;
/**
* @private
* @type {number}
*/
this.textScale_ = 0;
/**
* @private
* @type {?ol.render.canvas.FillState}
*/
this.textFillState_ = null;
/**
* @private
* @type {?ol.render.canvas.StrokeState}
*/
this.textStrokeState_ = null;
/**
* @private
* @type {?ol.render.canvas.TextState}
*/
this.textState_ = null;
};
goog.inherits(ol.render.canvas.TextReplay, ol.render.canvas.Replay);
/**
* @inheritDoc
*/
ol.render.canvas.TextReplay.prototype.drawText =
function(flatCoordinates, offset, end, stride, geometry, data) {
if (this.text_ === '' ||
goog.isNull(this.textState_) ||
(goog.isNull(this.textFillState_) &&
goog.isNull(this.textStrokeState_))) {
return;
}
ol.extent.extendFlatCoordinates(
this.extent_, flatCoordinates, offset, end, stride);
if (!goog.isNull(this.textFillState_)) {
this.setReplayFillState_(this.textFillState_);
}
if (!goog.isNull(this.textStrokeState_)) {
this.setReplayStrokeState_(this.textStrokeState_);
}
this.setReplayTextState_(this.textState_);
this.beginGeometry(geometry);
var myBegin = this.coordinates.length;
var myEnd =
this.appendFlatCoordinates(flatCoordinates, offset, end, stride, false);
var fill = !goog.isNull(this.textFillState_);
var stroke = !goog.isNull(this.textStrokeState_);
var drawTextInstruction = [
ol.render.canvas.Instruction.DRAW_TEXT, myBegin, myEnd, this.text_,
this.textRotation_, this.textScale_, fill, stroke];
this.instructions.push(drawTextInstruction);
this.hitDetectionInstructions.push(drawTextInstruction);
this.endGeometry(geometry, data);
};
/**
* @param {ol.render.canvas.FillState} fillState Fill state.
* @private
*/
ol.render.canvas.TextReplay.prototype.setReplayFillState_ =
function(fillState) {
var replayFillState = this.replayFillState_;
if (!goog.isNull(replayFillState) &&
replayFillState.fillStyle == fillState.fillStyle) {
return;
}
var setFillStyleInstruction =
[ol.render.canvas.Instruction.SET_FILL_STYLE, fillState.fillStyle];
this.instructions.push(setFillStyleInstruction);
this.hitDetectionInstructions.push(setFillStyleInstruction);
if (goog.isNull(replayFillState)) {
this.replayFillState_ = {
fillStyle: fillState.fillStyle
};
} else {
replayFillState.fillStyle = fillState.fillStyle;
}
};
/**
* @param {ol.render.canvas.StrokeState} strokeState Stroke state.
* @private
*/
ol.render.canvas.TextReplay.prototype.setReplayStrokeState_ =
function(strokeState) {
var replayStrokeState = this.replayStrokeState_;
if (!goog.isNull(replayStrokeState) &&
replayStrokeState.lineCap == strokeState.lineCap &&
replayStrokeState.lineDash == strokeState.lineDash &&
replayStrokeState.lineJoin == strokeState.lineJoin &&
replayStrokeState.lineWidth == strokeState.lineWidth &&
replayStrokeState.miterLimit == strokeState.miterLimit &&
replayStrokeState.strokeStyle == strokeState.strokeStyle) {
return;
}
var setStrokeStyleInstruction = [
ol.render.canvas.Instruction.SET_STROKE_STYLE, strokeState.strokeStyle,
strokeState.lineWidth, strokeState.lineCap, strokeState.lineJoin,
strokeState.miterLimit, strokeState.lineDash
];
this.instructions.push(setStrokeStyleInstruction);
this.hitDetectionInstructions.push(setStrokeStyleInstruction);
if (goog.isNull(replayStrokeState)) {
this.replayStrokeState_ = {
lineCap: strokeState.lineCap,
lineDash: strokeState.lineDash,
lineJoin: strokeState.lineJoin,
lineWidth: strokeState.lineWidth,
miterLimit: strokeState.miterLimit,
strokeStyle: strokeState.strokeStyle
};
} else {
replayStrokeState.lineCap = strokeState.lineCap;
replayStrokeState.lineDash = strokeState.lineDash;
replayStrokeState.lineJoin = strokeState.lineJoin;
replayStrokeState.lineWidth = strokeState.lineWidth;
replayStrokeState.miterLimit = strokeState.miterLimit;
replayStrokeState.strokeStyle = strokeState.strokeStyle;
}
};
/**
* @param {ol.render.canvas.TextState} textState Text state.
* @private
*/
ol.render.canvas.TextReplay.prototype.setReplayTextState_ =
function(textState) {
var replayTextState = this.replayTextState_;
if (!goog.isNull(replayTextState) &&
replayTextState.font == textState.font &&
replayTextState.textAlign == textState.textAlign &&
replayTextState.textBaseline == textState.textBaseline) {
return;
}
var setTextStyleInstruction = [ol.render.canvas.Instruction.SET_TEXT_STYLE,
textState.font, textState.textAlign, textState.textBaseline];
this.instructions.push(setTextStyleInstruction);
this.hitDetectionInstructions.push(setTextStyleInstruction);
if (goog.isNull(replayTextState)) {
this.replayTextState_ = {
font: textState.font,
textAlign: textState.textAlign,
textBaseline: textState.textBaseline
};
} else {
replayTextState.font = textState.font;
replayTextState.textAlign = textState.textAlign;
replayTextState.textBaseline = textState.textBaseline;
}
};
/**
* @inheritDoc
*/
ol.render.canvas.TextReplay.prototype.setTextStyle = function(textStyle) {
if (goog.isNull(textStyle)) {
this.text_ = '';
} else {
var textFillStyle = textStyle.getFill();
if (goog.isNull(textFillStyle)) {
this.textFillState_ = null;
} else {
var textFillStyleColor = textFillStyle.getColor();
var fillStyle = ol.color.asString(!goog.isNull(textFillStyleColor) ?
textFillStyleColor : ol.render.canvas.defaultFillStyle);
if (goog.isNull(this.textFillState_)) {
this.textFillState_ = {
fillStyle: fillStyle
};
} else {
var textFillState = this.textFillState_;
textFillState.fillStyle = fillStyle;
}
}
var textStrokeStyle = textStyle.getStroke();
if (goog.isNull(textStrokeStyle)) {
this.textStrokeState_ = null;
} else {
var textStrokeStyleColor = textStrokeStyle.getColor();
var textStrokeStyleLineCap = textStrokeStyle.getLineCap();
var textStrokeStyleLineDash = textStrokeStyle.getLineDash();
var textStrokeStyleLineJoin = textStrokeStyle.getLineJoin();
var textStrokeStyleWidth = textStrokeStyle.getWidth();
var textStrokeStyleMiterLimit = textStrokeStyle.getMiterLimit();
var lineCap = goog.isDef(textStrokeStyleLineCap) ?
textStrokeStyleLineCap : ol.render.canvas.defaultLineCap;
var lineDash = goog.isDefAndNotNull(textStrokeStyleLineDash) ?
textStrokeStyleLineDash : ol.render.canvas.defaultLineDash;
var lineJoin = goog.isDef(textStrokeStyleLineJoin) ?
textStrokeStyleLineJoin : ol.render.canvas.defaultLineJoin;
var lineWidth = goog.isDef(textStrokeStyleWidth) ?
textStrokeStyleWidth : ol.render.canvas.defaultLineWidth;
var miterLimit = goog.isDef(textStrokeStyleMiterLimit) ?
textStrokeStyleMiterLimit : ol.render.canvas.defaultMiterLimit;
var strokeStyle = ol.color.asString(!goog.isNull(textStrokeStyleColor) ?
textStrokeStyleColor : ol.render.canvas.defaultStrokeStyle);
if (goog.isNull(this.textStrokeState_)) {
this.textStrokeState_ = {
lineCap: lineCap,
lineDash: lineDash,
lineJoin: lineJoin,
lineWidth: lineWidth,
miterLimit: miterLimit,
strokeStyle: strokeStyle
};
} else {
var textStrokeState = this.textStrokeState_;
textStrokeState.lineCap = lineCap;
textStrokeState.lineDash = lineDash;
textStrokeState.lineJoin = lineJoin;
textStrokeState.lineWidth = lineWidth;
textStrokeState.miterLimit = miterLimit;
textStrokeState.strokeStyle = strokeStyle;
}
}
var textFont = textStyle.getFont();
var textRotation = textStyle.getRotation();
var textScale = textStyle.getScale();
var textText = textStyle.getText();
var textTextAlign = textStyle.getTextAlign();
var textTextBaseline = textStyle.getTextBaseline();
var font = goog.isDef(textFont) ?
textFont : ol.render.canvas.defaultFont;
var textAlign = goog.isDef(textTextAlign) ?
textTextAlign : ol.render.canvas.defaultTextAlign;
var textBaseline = goog.isDef(textTextBaseline) ?
textTextBaseline : ol.render.canvas.defaultTextBaseline;
if (goog.isNull(this.textState_)) {
this.textState_ = {
font: font,
textAlign: textAlign,
textBaseline: textBaseline
};
} else {
var textState = this.textState_;
textState.font = font;
textState.textAlign = textAlign;
textState.textBaseline = textBaseline;
}
this.text_ = goog.isDef(textText) ? textText : '';
this.textRotation_ = goog.isDef(textRotation) ? textRotation : 0;
this.textScale_ = goog.isDef(textScale) ? textScale : 1;
}
};
/**
* @constructor
* @implements {ol.render.IReplayGroup}
@@ -1489,5 +1846,6 @@ ol.render.canvas.ReplayGroup.prototype.isEmpty = function() {
ol.render.canvas.BATCH_CONSTRUCTORS_ = {
'Image': ol.render.canvas.ImageReplay,
'LineString': ol.render.canvas.LineStringReplay,
'Polygon': ol.render.canvas.PolygonReplay
'Polygon': ol.render.canvas.PolygonReplay,
'Text': ol.render.canvas.TextReplay
};

13
src/ol/render/irender.js
View File

@@ -100,6 +100,19 @@ ol.render.IRender.prototype.drawPolygonGeometry =
};
/**
* @param {Array.<number>} flatCoordinates Flat coordinates.
* @param {number} offset Offset.
* @param {number} end End.
* @param {number} stride Stride.
* @param {ol.geom.Geometry} geometry Geometry.
* @param {Object} data Opaque data object.
*/
ol.render.IRender.prototype.drawText =
function(flatCoordinates, offset, end, stride, geometry, data) {
};
/**
* @param {ol.style.Fill} fillStyle Fill style.
* @param {ol.style.Stroke} strokeStyle Stroke style.

6
src/ol/render/ireplay.js
View File

@@ -10,7 +10,8 @@ goog.require('ol.render.IRender');
ol.render.ReplayType = {
IMAGE: 'Image',
LINE_STRING: 'LineString',
POLYGON: 'Polygon'
POLYGON: 'Polygon',
TEXT: 'Text'
};
@@ -21,7 +22,8 @@ ol.render.ReplayType = {
ol.render.REPLAY_ORDER = [
ol.render.ReplayType.POLYGON,
ol.render.ReplayType.LINE_STRING,
ol.render.ReplayType.IMAGE
ol.render.ReplayType.IMAGE,
ol.render.ReplayType.TEXT
];

156
src/ol/render/vector.js
View File

@@ -22,17 +22,22 @@ goog.require('ol.style.Style');
*/
ol.renderer.vector.renderCircleGeometry_ =
function(replayGroup, geometry, style, data) {
goog.asserts.assertInstanceof(geometry, ol.geom.Circle);
var fillStyle = style.getFill();
var strokeStyle = style.getStroke();
if (goog.isNull(fillStyle) && goog.isNull(strokeStyle)) {
return;
if (!goog.isNull(fillStyle) || !goog.isNull(strokeStyle)) {
var polygonReplay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.POLYGON);
polygonReplay.setFillStrokeStyle(fillStyle, strokeStyle);
polygonReplay.drawCircleGeometry(geometry, data);
}
var textStyle = style.getText();
if (!goog.isNull(textStyle)) {
var textReplay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.TEXT);
textReplay.setTextStyle(textStyle);
textReplay.drawText(geometry.getCenter(), 0, 2, 2, geometry, data);
}
goog.asserts.assertInstanceof(geometry, ol.geom.Circle);
var circleGeometry = /** @type {ol.geom.Circle} */ (geometry);
var replay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.POLYGON);
replay.setFillStrokeStyle(fillStyle, strokeStyle);
replay.drawCircleGeometry(circleGeometry, data);
};
@@ -87,15 +92,21 @@ ol.renderer.vector.renderGeometryCollectionGeometry_ =
*/
ol.renderer.vector.renderLineStringGeometry_ =
function(replayGroup, geometry, style, data) {
var strokeStyle = style.getStroke();
if (goog.isNull(strokeStyle)) {
return;
}
goog.asserts.assertInstanceof(geometry, ol.geom.LineString);
var replay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.LINE_STRING);
replay.setFillStrokeStyle(null, strokeStyle);
replay.drawLineStringGeometry(geometry, data);
var strokeStyle = style.getStroke();
if (!goog.isNull(strokeStyle)) {
var lineStringReplay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.LINE_STRING);
lineStringReplay.setFillStrokeStyle(null, strokeStyle);
lineStringReplay.drawLineStringGeometry(geometry, data);
}
var textStyle = style.getText();
if (!goog.isNull(textStyle)) {
var textReplay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.TEXT);
textReplay.setTextStyle(textStyle);
textReplay.drawText(geometry.getFlatMidpoint(), 0, 2, 2, geometry, data);
}
};
@@ -108,15 +119,23 @@ ol.renderer.vector.renderLineStringGeometry_ =
*/
ol.renderer.vector.renderMultiLineStringGeometry_ =
function(replayGroup, geometry, style, data) {
var strokeStyle = style.getStroke();
if (goog.isNull(strokeStyle)) {
return;
}
goog.asserts.assertInstanceof(geometry, ol.geom.MultiLineString);
var replay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.LINE_STRING);
replay.setFillStrokeStyle(null, strokeStyle);
replay.drawMultiLineStringGeometry(geometry, data);
var strokeStyle = style.getStroke();
if (!goog.isNull(strokeStyle)) {
var lineStringReplay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.LINE_STRING);
lineStringReplay.setFillStrokeStyle(null, strokeStyle);
lineStringReplay.drawMultiLineStringGeometry(geometry, data);
}
var textStyle = style.getText();
if (!goog.isNull(textStyle)) {
var textReplay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.TEXT);
textReplay.setTextStyle(textStyle);
var flatMidpointCoordinates = geometry.getFlatMidpoints();
textReplay.drawText(flatMidpointCoordinates, 0,
flatMidpointCoordinates.length, 2, geometry, data);
}
};
@@ -129,16 +148,24 @@ ol.renderer.vector.renderMultiLineStringGeometry_ =
*/
ol.renderer.vector.renderMultiPolygonGeometry_ =
function(replayGroup, geometry, style, data) {
goog.asserts.assertInstanceof(geometry, ol.geom.MultiPolygon);
var fillStyle = style.getFill();
var strokeStyle = style.getStroke();
if (goog.isNull(strokeStyle) && goog.isNull(fillStyle)) {
return;
if (!goog.isNull(strokeStyle) && !goog.isNull(fillStyle)) {
var polygonReplay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.POLYGON);
polygonReplay.setFillStrokeStyle(fillStyle, strokeStyle);
polygonReplay.drawMultiPolygonGeometry(geometry, data);
}
var textStyle = style.getText();
if (!goog.isNull(textStyle)) {
var textReplay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.TEXT);
textReplay.setTextStyle(textStyle);
var flatInteriorPointCoordinates = geometry.getFlatInteriorPoints();
textReplay.drawText(flatInteriorPointCoordinates, 0,
flatInteriorPointCoordinates.length, 2, geometry, data);
}
goog.asserts.assertInstanceof(geometry, ol.geom.MultiPolygon);
var replay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.POLYGON);
replay.setFillStrokeStyle(fillStyle, strokeStyle);
replay.drawMultiPolygonGeometry(geometry, data);
};
@@ -151,15 +178,21 @@ ol.renderer.vector.renderMultiPolygonGeometry_ =
*/
ol.renderer.vector.renderPointGeometry_ =
function(replayGroup, geometry, style, data) {
var imageStyle = style.getImage();
if (goog.isNull(imageStyle)) {
return;
}
goog.asserts.assertInstanceof(geometry, ol.geom.Point);
var replay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.IMAGE);
replay.setImageStyle(imageStyle);
replay.drawPointGeometry(geometry, data);
var imageStyle = style.getImage();
if (!goog.isNull(imageStyle)) {
var imageReplay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.IMAGE);
imageReplay.setImageStyle(imageStyle);
imageReplay.drawPointGeometry(geometry, data);
}
var textStyle = style.getText();
if (!goog.isNull(textStyle)) {
var textReplay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.TEXT);
textReplay.setTextStyle(textStyle);
textReplay.drawText(geometry.getCoordinates(), 0, 2, 2, geometry, data);
}
};
@@ -172,15 +205,23 @@ ol.renderer.vector.renderPointGeometry_ =
*/
ol.renderer.vector.renderMultiPointGeometry_ =
function(replayGroup, geometry, style, data) {
var imageStyle = style.getImage();
if (goog.isNull(imageStyle)) {
return;
}
goog.asserts.assertInstanceof(geometry, ol.geom.MultiPoint);
var replay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.IMAGE);
replay.setImageStyle(imageStyle);
replay.drawMultiPointGeometry(geometry, data);
var imageStyle = style.getImage();
if (!goog.isNull(imageStyle)) {
var imageReplay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.IMAGE);
imageReplay.setImageStyle(imageStyle);
imageReplay.drawMultiPointGeometry(geometry, data);
}
var textStyle = style.getText();
if (!goog.isNull(textStyle)) {
var textReplay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.TEXT);
textReplay.setTextStyle(textStyle);
var flatCoordinates = geometry.getFlatCoordinates();
textReplay.drawText(flatCoordinates, 0, flatCoordinates.length,
geometry.getStride(), geometry, data);
}
};
@@ -193,16 +234,23 @@ ol.renderer.vector.renderMultiPointGeometry_ =
*/
ol.renderer.vector.renderPolygonGeometry_ =
function(replayGroup, geometry, style, data) {
goog.asserts.assertInstanceof(geometry, ol.geom.Polygon);
var fillStyle = style.getFill();
var strokeStyle = style.getStroke();
if (goog.isNull(fillStyle) && goog.isNull(strokeStyle)) {
return;
if (!goog.isNull(fillStyle) || !goog.isNull(strokeStyle)) {
var polygonReplay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.POLYGON);
polygonReplay.setFillStrokeStyle(fillStyle, strokeStyle);
polygonReplay.drawPolygonGeometry(geometry, data);
}
var textStyle = style.getText();
if (!goog.isNull(textStyle)) {
var textReplay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.TEXT);
textReplay.setTextStyle(textStyle);
textReplay.drawText(
geometry.getFlatInteriorPoint(), 0, 2, 2, geometry, data);
}
goog.asserts.assertInstanceof(geometry, ol.geom.Polygon);
var replay = replayGroup.getReplay(
style.getZIndex(), ol.render.ReplayType.POLYGON);
replay.setFillStrokeStyle(fillStyle, strokeStyle);
replay.drawPolygonGeometry(geometry, data);
};

8
src/ol/render/webgl/webglimmediate.js
View File

@@ -91,6 +91,14 @@ ol.render.webgl.Immediate.prototype.drawPolygonGeometry =
};
/**
* @inheritDoc
*/
ol.render.webgl.Immediate.prototype.drawText =
function(flatCoordinates, offset, end, stride, geometry, data) {
};
/**
* @inheritDoc
*/

40
src/ol/style/textstyle.js
View File

@@ -22,6 +22,12 @@ ol.style.Text = function(opt_options) {
*/
this.rotation_ = options.rotation;
/**
* @private
* @type {number|undefined}
*/
this.scale_ = options.scale;
/**
* @private
* @type {string|undefined}
@@ -54,32 +60,6 @@ ol.style.Text = function(opt_options) {
};
/**
* @param {ol.style.Text} textStyle1 Text style 1.
* @param {ol.style.Text} textStyle2 Text style 2.
* @return {boolean} Equals.
*/
ol.style.Text.equals = function(textStyle1, textStyle2) {
if (!goog.isNull(textStyle1)) {
if (!goog.isNull(textStyle2)) {
return textStyle1 === textStyle2 || (
textStyle1.getFont() == textStyle2.getFont() &&
textStyle1.getText() == textStyle2.getText() &&
textStyle1.getTextAlign() == textStyle2.getTextAlign() &&
textStyle1.getTextBaseline() == textStyle2.getTextBaseline());
} else {
return false;
}
} else {
if (!goog.isNull(textStyle2)) {
return false;
} else {
return true;
}
}
};
/**
* @return {string|undefined} Font.
*/
@@ -104,6 +84,14 @@ ol.style.Text.prototype.getRotation = function() {
};
/**
* @return {number|undefined} Scale.
*/
ol.style.Text.prototype.getScale = function() {
return this.scale_;
};
/**
* @return {ol.style.Stroke} Stroke style.
*/

12
test/spec/ol/geom/linestring.test.js
View File

@@ -164,6 +164,18 @@ describe('ol.geom.LineString', function() {
[[0, 0], [1.5, 1], [3, 3], [5, 1], [6, 3.5], [7, 5]]);
});
describe('#getFlatMidpoint', function() {
it('returns the expected result', function() {
var midpoint = lineString.getFlatMidpoint();
expect(midpoint).to.be.an(Array);
expect(midpoint).to.have.length(2);
expect(midpoint[0]).to.roughlyEqual(4, 1e-1);
expect(midpoint[1]).to.roughlyEqual(2, 1e-1);
});
});
describe('#getSimplifiedGeometry', function() {
it('returns the expectedResult', function() {

8
test/spec/ol/geom/multilinestring.test.js
View File

@@ -69,6 +69,14 @@ describe('ol.geom.MultiLineString', function() {
expect(multiLineString.getStride()).to.be(2);
});
describe('#getFlatMidpoints', function() {
it('returns the expected result', function() {
expect(multiLineString.getFlatMidpoints()).to.eql([2, 3, 6, 7]);
});
});
});
describe('construct with 3D coordinates', function() {