Named exports from ol/render/canvas
This commit is contained in:
@@ -6,125 +6,123 @@ import {createCanvasContext2D} from '../dom.js';
|
|||||||
import {clear} from '../obj.js';
|
import {clear} from '../obj.js';
|
||||||
import LRUCache from '../structs/LRUCache.js';
|
import LRUCache from '../structs/LRUCache.js';
|
||||||
import _ol_transform_ from '../transform.js';
|
import _ol_transform_ from '../transform.js';
|
||||||
const _ol_render_canvas_ = {};
|
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @const
|
* @const
|
||||||
* @type {string}
|
* @type {string}
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.defaultFont = '10px sans-serif';
|
export const defaultFont = '10px sans-serif';
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @const
|
* @const
|
||||||
* @type {ol.Color}
|
* @type {ol.Color}
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.defaultFillStyle = [0, 0, 0, 1];
|
export const defaultFillStyle = [0, 0, 0, 1];
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @const
|
* @const
|
||||||
* @type {string}
|
* @type {string}
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.defaultLineCap = 'round';
|
export const defaultLineCap = 'round';
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @const
|
* @const
|
||||||
* @type {Array.<number>}
|
* @type {Array.<number>}
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.defaultLineDash = [];
|
export const defaultLineDash = [];
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @const
|
* @const
|
||||||
* @type {number}
|
* @type {number}
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.defaultLineDashOffset = 0;
|
export const defaultLineDashOffset = 0;
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @const
|
* @const
|
||||||
* @type {string}
|
* @type {string}
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.defaultLineJoin = 'round';
|
export const defaultLineJoin = 'round';
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @const
|
* @const
|
||||||
* @type {number}
|
* @type {number}
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.defaultMiterLimit = 10;
|
export const defaultMiterLimit = 10;
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @const
|
* @const
|
||||||
* @type {ol.Color}
|
* @type {ol.Color}
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.defaultStrokeStyle = [0, 0, 0, 1];
|
export const defaultStrokeStyle = [0, 0, 0, 1];
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @const
|
* @const
|
||||||
* @type {string}
|
* @type {string}
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.defaultTextAlign = 'center';
|
export const defaultTextAlign = 'center';
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @const
|
* @const
|
||||||
* @type {string}
|
* @type {string}
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.defaultTextBaseline = 'middle';
|
export const defaultTextBaseline = 'middle';
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @const
|
* @const
|
||||||
* @type {Array.<number>}
|
* @type {Array.<number>}
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.defaultPadding = [0, 0, 0, 0];
|
export const defaultPadding = [0, 0, 0, 0];
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @const
|
* @const
|
||||||
* @type {number}
|
* @type {number}
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.defaultLineWidth = 1;
|
export const defaultLineWidth = 1;
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @type {ol.structs.LRUCache.<HTMLCanvasElement>}
|
* @type {ol.structs.LRUCache.<HTMLCanvasElement>}
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.labelCache = new LRUCache();
|
export const labelCache = new LRUCache();
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @type {!Object.<string, number>}
|
* @type {!Object.<string, number>}
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.checkedFonts_ = {};
|
export const checkedFonts = {};
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @type {CanvasRenderingContext2D}
|
* @type {CanvasRenderingContext2D}
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.measureContext_ = null;
|
let measureContext = null;
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @type {!Object.<string, number>}
|
* @type {!Object.<string, number>}
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.textHeights_ = {};
|
export const textHeights = {};
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Clears the label cache when a font becomes available.
|
* Clears the label cache when a font becomes available.
|
||||||
* @param {string} fontSpec CSS font spec.
|
* @param {string} fontSpec CSS font spec.
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.checkFont = (function() {
|
export const checkFont = (function() {
|
||||||
const retries = 60;
|
const retries = 60;
|
||||||
const checked = _ol_render_canvas_.checkedFonts_;
|
const checked = checkedFonts;
|
||||||
const labelCache = _ol_render_canvas_.labelCache;
|
|
||||||
const size = '32px ';
|
const size = '32px ';
|
||||||
const referenceFonts = ['monospace', 'serif'];
|
const referenceFonts = ['monospace', 'serif'];
|
||||||
const len = referenceFonts.length;
|
const len = referenceFonts.length;
|
||||||
@@ -132,7 +130,7 @@ _ol_render_canvas_.checkFont = (function() {
|
|||||||
let interval, referenceWidth;
|
let interval, referenceWidth;
|
||||||
|
|
||||||
function isAvailable(font) {
|
function isAvailable(font) {
|
||||||
const context = _ol_render_canvas_.getMeasureContext();
|
const context = getMeasureContext();
|
||||||
let available = true;
|
let available = true;
|
||||||
for (let i = 0; i < len; ++i) {
|
for (let i = 0; i < len; ++i) {
|
||||||
const referenceFont = referenceFonts[i];
|
const referenceFont = referenceFonts[i];
|
||||||
@@ -155,9 +153,9 @@ _ol_render_canvas_.checkFont = (function() {
|
|||||||
if (checked[font] < retries) {
|
if (checked[font] < retries) {
|
||||||
if (isAvailable(font)) {
|
if (isAvailable(font)) {
|
||||||
checked[font] = retries;
|
checked[font] = retries;
|
||||||
clear(_ol_render_canvas_.textHeights_);
|
clear(textHeights);
|
||||||
// Make sure that loaded fonts are picked up by Safari
|
// Make sure that loaded fonts are picked up by Safari
|
||||||
_ol_render_canvas_.measureContext_ = null;
|
measureContext = null;
|
||||||
labelCache.clear();
|
labelCache.clear();
|
||||||
} else {
|
} else {
|
||||||
++checked[font];
|
++checked[font];
|
||||||
@@ -195,22 +193,21 @@ _ol_render_canvas_.checkFont = (function() {
|
|||||||
/**
|
/**
|
||||||
* @return {CanvasRenderingContext2D} Measure context.
|
* @return {CanvasRenderingContext2D} Measure context.
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.getMeasureContext = function() {
|
function getMeasureContext() {
|
||||||
let context = _ol_render_canvas_.measureContext_;
|
if (!measureContext) {
|
||||||
if (!context) {
|
measureContext = createCanvasContext2D(1, 1);
|
||||||
context = _ol_render_canvas_.measureContext_ = createCanvasContext2D(1, 1);
|
|
||||||
}
|
}
|
||||||
return context;
|
return measureContext;
|
||||||
};
|
}
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @param {string} font Font to use for measuring.
|
* @param {string} font Font to use for measuring.
|
||||||
* @return {ol.Size} Measurement.
|
* @return {ol.Size} Measurement.
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.measureTextHeight = (function() {
|
export const measureTextHeight = (function() {
|
||||||
let span;
|
let span;
|
||||||
const heights = _ol_render_canvas_.textHeights_;
|
const heights = textHeights;
|
||||||
return function(font) {
|
return function(font) {
|
||||||
let height = heights[font];
|
let height = heights[font];
|
||||||
if (height == undefined) {
|
if (height == undefined) {
|
||||||
@@ -236,13 +233,13 @@ _ol_render_canvas_.measureTextHeight = (function() {
|
|||||||
* @param {string} text Text.
|
* @param {string} text Text.
|
||||||
* @return {number} Width.
|
* @return {number} Width.
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.measureTextWidth = function(font, text) {
|
export function measureTextWidth(font, text) {
|
||||||
const measureContext = _ol_render_canvas_.getMeasureContext();
|
const measureContext = getMeasureContext();
|
||||||
if (font != measureContext.font) {
|
if (font != measureContext.font) {
|
||||||
measureContext.font = font;
|
measureContext.font = font;
|
||||||
}
|
}
|
||||||
return measureContext.measureText(text).width;
|
return measureContext.measureText(text).width;
|
||||||
};
|
}
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -251,16 +248,16 @@ _ol_render_canvas_.measureTextWidth = function(font, text) {
|
|||||||
* @param {number} offsetX X offset.
|
* @param {number} offsetX X offset.
|
||||||
* @param {number} offsetY Y offset.
|
* @param {number} offsetY Y offset.
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.rotateAtOffset = function(context, rotation, offsetX, offsetY) {
|
export function rotateAtOffset(context, rotation, offsetX, offsetY) {
|
||||||
if (rotation !== 0) {
|
if (rotation !== 0) {
|
||||||
context.translate(offsetX, offsetY);
|
context.translate(offsetX, offsetY);
|
||||||
context.rotate(rotation);
|
context.rotate(rotation);
|
||||||
context.translate(-offsetX, -offsetY);
|
context.translate(-offsetX, -offsetY);
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
|
|
||||||
_ol_render_canvas_.resetTransform_ = _ol_transform_.create();
|
export const resetTransform = _ol_transform_.create();
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -276,7 +273,7 @@ _ol_render_canvas_.resetTransform_ = _ol_transform_.create();
|
|||||||
* @param {number} y Y.
|
* @param {number} y Y.
|
||||||
* @param {number} scale Scale.
|
* @param {number} scale Scale.
|
||||||
*/
|
*/
|
||||||
_ol_render_canvas_.drawImage = function(context,
|
export function drawImage(context,
|
||||||
transform, opacity, image, originX, originY, w, h, x, y, scale) {
|
transform, opacity, image, originX, originY, w, h, x, y, scale) {
|
||||||
let alpha;
|
let alpha;
|
||||||
if (opacity != 1) {
|
if (opacity != 1) {
|
||||||
@@ -293,7 +290,6 @@ _ol_render_canvas_.drawImage = function(context,
|
|||||||
context.globalAlpha = alpha;
|
context.globalAlpha = alpha;
|
||||||
}
|
}
|
||||||
if (transform) {
|
if (transform) {
|
||||||
context.setTransform.apply(context, _ol_render_canvas_.resetTransform_);
|
context.setTransform.apply(context, resetTransform);
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
export default _ol_render_canvas_;
|
|
||||||
|
|||||||
@@ -14,7 +14,7 @@ import SimpleGeometry from '../../geom/SimpleGeometry.js';
|
|||||||
import {transform2D} from '../../geom/flat/transform.js';
|
import {transform2D} from '../../geom/flat/transform.js';
|
||||||
import {CANVAS_LINE_DASH} from '../../has.js';
|
import {CANVAS_LINE_DASH} from '../../has.js';
|
||||||
import VectorContext from '../VectorContext.js';
|
import VectorContext from '../VectorContext.js';
|
||||||
import _ol_render_canvas_ from '../canvas.js';
|
import {defaultTextAlign, defaultFillStyle, defaultLineCap, defaultLineDash, defaultLineDashOffset, defaultLineJoin, defaultLineWidth, defaultMiterLimit, defaultStrokeStyle, defaultTextBaseline, defaultFont} from '../canvas.js';
|
||||||
import _ol_transform_ from '../../transform.js';
|
import _ol_transform_ from '../../transform.js';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -784,7 +784,7 @@ CanvasImmediateRenderer.prototype.setContextTextState_ = function(textState) {
|
|||||||
const context = this.context_;
|
const context = this.context_;
|
||||||
const contextTextState = this.contextTextState_;
|
const contextTextState = this.contextTextState_;
|
||||||
const textAlign = textState.textAlign ?
|
const textAlign = textState.textAlign ?
|
||||||
textState.textAlign : _ol_render_canvas_.defaultTextAlign;
|
textState.textAlign : defaultTextAlign;
|
||||||
if (!contextTextState) {
|
if (!contextTextState) {
|
||||||
context.font = textState.font;
|
context.font = textState.font;
|
||||||
context.textAlign = textAlign;
|
context.textAlign = textAlign;
|
||||||
@@ -824,7 +824,7 @@ CanvasImmediateRenderer.prototype.setFillStrokeStyle = function(fillStyle, strok
|
|||||||
const fillStyleColor = fillStyle.getColor();
|
const fillStyleColor = fillStyle.getColor();
|
||||||
this.fillState_ = {
|
this.fillState_ = {
|
||||||
fillStyle: asColorLike(fillStyleColor ?
|
fillStyle: asColorLike(fillStyleColor ?
|
||||||
fillStyleColor : _ol_render_canvas_.defaultFillStyle)
|
fillStyleColor : defaultFillStyle)
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
if (!strokeStyle) {
|
if (!strokeStyle) {
|
||||||
@@ -839,19 +839,19 @@ CanvasImmediateRenderer.prototype.setFillStrokeStyle = function(fillStyle, strok
|
|||||||
const strokeStyleMiterLimit = strokeStyle.getMiterLimit();
|
const strokeStyleMiterLimit = strokeStyle.getMiterLimit();
|
||||||
this.strokeState_ = {
|
this.strokeState_ = {
|
||||||
lineCap: strokeStyleLineCap !== undefined ?
|
lineCap: strokeStyleLineCap !== undefined ?
|
||||||
strokeStyleLineCap : _ol_render_canvas_.defaultLineCap,
|
strokeStyleLineCap : defaultLineCap,
|
||||||
lineDash: strokeStyleLineDash ?
|
lineDash: strokeStyleLineDash ?
|
||||||
strokeStyleLineDash : _ol_render_canvas_.defaultLineDash,
|
strokeStyleLineDash : defaultLineDash,
|
||||||
lineDashOffset: strokeStyleLineDashOffset ?
|
lineDashOffset: strokeStyleLineDashOffset ?
|
||||||
strokeStyleLineDashOffset : _ol_render_canvas_.defaultLineDashOffset,
|
strokeStyleLineDashOffset : defaultLineDashOffset,
|
||||||
lineJoin: strokeStyleLineJoin !== undefined ?
|
lineJoin: strokeStyleLineJoin !== undefined ?
|
||||||
strokeStyleLineJoin : _ol_render_canvas_.defaultLineJoin,
|
strokeStyleLineJoin : defaultLineJoin,
|
||||||
lineWidth: this.pixelRatio_ * (strokeStyleWidth !== undefined ?
|
lineWidth: this.pixelRatio_ * (strokeStyleWidth !== undefined ?
|
||||||
strokeStyleWidth : _ol_render_canvas_.defaultLineWidth),
|
strokeStyleWidth : defaultLineWidth),
|
||||||
miterLimit: strokeStyleMiterLimit !== undefined ?
|
miterLimit: strokeStyleMiterLimit !== undefined ?
|
||||||
strokeStyleMiterLimit : _ol_render_canvas_.defaultMiterLimit,
|
strokeStyleMiterLimit : defaultMiterLimit,
|
||||||
strokeStyle: asColorLike(strokeStyleColor ?
|
strokeStyle: asColorLike(strokeStyleColor ?
|
||||||
strokeStyleColor : _ol_render_canvas_.defaultStrokeStyle)
|
strokeStyleColor : defaultStrokeStyle)
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
@@ -907,7 +907,7 @@ CanvasImmediateRenderer.prototype.setTextStyle = function(textStyle) {
|
|||||||
const textFillStyleColor = textFillStyle.getColor();
|
const textFillStyleColor = textFillStyle.getColor();
|
||||||
this.textFillState_ = {
|
this.textFillState_ = {
|
||||||
fillStyle: asColorLike(textFillStyleColor ?
|
fillStyle: asColorLike(textFillStyleColor ?
|
||||||
textFillStyleColor : _ol_render_canvas_.defaultFillStyle)
|
textFillStyleColor : defaultFillStyle)
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
const textStrokeStyle = textStyle.getStroke();
|
const textStrokeStyle = textStyle.getStroke();
|
||||||
@@ -923,19 +923,19 @@ CanvasImmediateRenderer.prototype.setTextStyle = function(textStyle) {
|
|||||||
const textStrokeStyleMiterLimit = textStrokeStyle.getMiterLimit();
|
const textStrokeStyleMiterLimit = textStrokeStyle.getMiterLimit();
|
||||||
this.textStrokeState_ = {
|
this.textStrokeState_ = {
|
||||||
lineCap: textStrokeStyleLineCap !== undefined ?
|
lineCap: textStrokeStyleLineCap !== undefined ?
|
||||||
textStrokeStyleLineCap : _ol_render_canvas_.defaultLineCap,
|
textStrokeStyleLineCap : defaultLineCap,
|
||||||
lineDash: textStrokeStyleLineDash ?
|
lineDash: textStrokeStyleLineDash ?
|
||||||
textStrokeStyleLineDash : _ol_render_canvas_.defaultLineDash,
|
textStrokeStyleLineDash : defaultLineDash,
|
||||||
lineDashOffset: textStrokeStyleLineDashOffset ?
|
lineDashOffset: textStrokeStyleLineDashOffset ?
|
||||||
textStrokeStyleLineDashOffset : _ol_render_canvas_.defaultLineDashOffset,
|
textStrokeStyleLineDashOffset : defaultLineDashOffset,
|
||||||
lineJoin: textStrokeStyleLineJoin !== undefined ?
|
lineJoin: textStrokeStyleLineJoin !== undefined ?
|
||||||
textStrokeStyleLineJoin : _ol_render_canvas_.defaultLineJoin,
|
textStrokeStyleLineJoin : defaultLineJoin,
|
||||||
lineWidth: textStrokeStyleWidth !== undefined ?
|
lineWidth: textStrokeStyleWidth !== undefined ?
|
||||||
textStrokeStyleWidth : _ol_render_canvas_.defaultLineWidth,
|
textStrokeStyleWidth : defaultLineWidth,
|
||||||
miterLimit: textStrokeStyleMiterLimit !== undefined ?
|
miterLimit: textStrokeStyleMiterLimit !== undefined ?
|
||||||
textStrokeStyleMiterLimit : _ol_render_canvas_.defaultMiterLimit,
|
textStrokeStyleMiterLimit : defaultMiterLimit,
|
||||||
strokeStyle: asColorLike(textStrokeStyleColor ?
|
strokeStyle: asColorLike(textStrokeStyleColor ?
|
||||||
textStrokeStyleColor : _ol_render_canvas_.defaultStrokeStyle)
|
textStrokeStyleColor : defaultStrokeStyle)
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
const textFont = textStyle.getFont();
|
const textFont = textStyle.getFont();
|
||||||
@@ -949,11 +949,11 @@ CanvasImmediateRenderer.prototype.setTextStyle = function(textStyle) {
|
|||||||
const textTextBaseline = textStyle.getTextBaseline();
|
const textTextBaseline = textStyle.getTextBaseline();
|
||||||
this.textState_ = {
|
this.textState_ = {
|
||||||
font: textFont !== undefined ?
|
font: textFont !== undefined ?
|
||||||
textFont : _ol_render_canvas_.defaultFont,
|
textFont : defaultFont,
|
||||||
textAlign: textTextAlign !== undefined ?
|
textAlign: textTextAlign !== undefined ?
|
||||||
textTextAlign : _ol_render_canvas_.defaultTextAlign,
|
textTextAlign : defaultTextAlign,
|
||||||
textBaseline: textTextBaseline !== undefined ?
|
textBaseline: textTextBaseline !== undefined ?
|
||||||
textTextBaseline : _ol_render_canvas_.defaultTextBaseline
|
textTextBaseline : defaultTextBaseline
|
||||||
};
|
};
|
||||||
this.text_ = textText !== undefined ? textText : '';
|
this.text_ = textText !== undefined ? textText : '';
|
||||||
this.textOffsetX_ =
|
this.textOffsetX_ =
|
||||||
|
|||||||
@@ -4,7 +4,7 @@
|
|||||||
import {inherits} from '../../index.js';
|
import {inherits} from '../../index.js';
|
||||||
import {asString} from '../../color.js';
|
import {asString} from '../../color.js';
|
||||||
import {snap} from '../../geom/flat/simplify.js';
|
import {snap} from '../../geom/flat/simplify.js';
|
||||||
import _ol_render_canvas_ from '../canvas.js';
|
import {defaultFillStyle} from '../canvas.js';
|
||||||
import CanvasInstruction, {
|
import CanvasInstruction, {
|
||||||
fillInstruction, strokeInstruction, beginPathInstruction, closePathInstruction
|
fillInstruction, strokeInstruction, beginPathInstruction, closePathInstruction
|
||||||
} from '../canvas/Instruction.js';
|
} from '../canvas/Instruction.js';
|
||||||
@@ -89,7 +89,7 @@ CanvasPolygonReplay.prototype.drawCircle = function(circleGeometry, feature) {
|
|||||||
// always fill the circle for hit detection
|
// always fill the circle for hit detection
|
||||||
this.hitDetectionInstructions.push([
|
this.hitDetectionInstructions.push([
|
||||||
CanvasInstruction.SET_FILL_STYLE,
|
CanvasInstruction.SET_FILL_STYLE,
|
||||||
asString(_ol_render_canvas_.defaultFillStyle)
|
asString(defaultFillStyle)
|
||||||
]);
|
]);
|
||||||
if (state.strokeStyle !== undefined) {
|
if (state.strokeStyle !== undefined) {
|
||||||
this.hitDetectionInstructions.push([
|
this.hitDetectionInstructions.push([
|
||||||
@@ -128,7 +128,7 @@ CanvasPolygonReplay.prototype.drawPolygon = function(polygonGeometry, feature) {
|
|||||||
// always fill the polygon for hit detection
|
// always fill the polygon for hit detection
|
||||||
this.hitDetectionInstructions.push([
|
this.hitDetectionInstructions.push([
|
||||||
CanvasInstruction.SET_FILL_STYLE,
|
CanvasInstruction.SET_FILL_STYLE,
|
||||||
asString(_ol_render_canvas_.defaultFillStyle)]
|
asString(defaultFillStyle)]
|
||||||
);
|
);
|
||||||
if (state.strokeStyle !== undefined) {
|
if (state.strokeStyle !== undefined) {
|
||||||
this.hitDetectionInstructions.push([
|
this.hitDetectionInstructions.push([
|
||||||
@@ -160,7 +160,7 @@ CanvasPolygonReplay.prototype.drawMultiPolygon = function(multiPolygonGeometry,
|
|||||||
// always fill the multi-polygon for hit detection
|
// always fill the multi-polygon for hit detection
|
||||||
this.hitDetectionInstructions.push([
|
this.hitDetectionInstructions.push([
|
||||||
CanvasInstruction.SET_FILL_STYLE,
|
CanvasInstruction.SET_FILL_STYLE,
|
||||||
asString(_ol_render_canvas_.defaultFillStyle)
|
asString(defaultFillStyle)
|
||||||
]);
|
]);
|
||||||
if (state.strokeStyle !== undefined) {
|
if (state.strokeStyle !== undefined) {
|
||||||
this.hitDetectionInstructions.push([
|
this.hitDetectionInstructions.push([
|
||||||
|
|||||||
@@ -15,7 +15,7 @@ import {transform2D} from '../../geom/flat/transform.js';
|
|||||||
import {CANVAS_LINE_DASH} from '../../has.js';
|
import {CANVAS_LINE_DASH} from '../../has.js';
|
||||||
import {isEmpty} from '../../obj.js';
|
import {isEmpty} from '../../obj.js';
|
||||||
import VectorContext from '../VectorContext.js';
|
import VectorContext from '../VectorContext.js';
|
||||||
import _ol_render_canvas_ from '../canvas.js';
|
import {drawImage, resetTransform, defaultPadding, defaultFillStyle, defaultStrokeStyle, defaultMiterLimit, defaultLineWidth, defaultLineJoin, defaultLineDashOffset, defaultLineDash, defaultLineCap} from '../canvas.js';
|
||||||
import CanvasInstruction from '../canvas/Instruction.js';
|
import CanvasInstruction from '../canvas/Instruction.js';
|
||||||
import _ol_render_replay_ from '../replay.js';
|
import _ol_render_replay_ from '../replay.js';
|
||||||
import _ol_transform_ from '../../transform.js';
|
import _ol_transform_ from '../../transform.js';
|
||||||
@@ -165,7 +165,7 @@ const CanvasReplay = function(tolerance, maxExtent, resolution, pixelRatio, over
|
|||||||
* @private
|
* @private
|
||||||
* @type {!ol.Transform}
|
* @type {!ol.Transform}
|
||||||
*/
|
*/
|
||||||
this.resetTransform_ = _ol_transform_.create();
|
this.resetTransform = _ol_transform_.create();
|
||||||
};
|
};
|
||||||
|
|
||||||
inherits(CanvasReplay, VectorContext);
|
inherits(CanvasReplay, VectorContext);
|
||||||
@@ -296,7 +296,7 @@ CanvasReplay.prototype.replayImage_ = function(context, x, y, image,
|
|||||||
/** @type {Array.<*>} */ (fillInstruction),
|
/** @type {Array.<*>} */ (fillInstruction),
|
||||||
/** @type {Array.<*>} */ (strokeInstruction));
|
/** @type {Array.<*>} */ (strokeInstruction));
|
||||||
}
|
}
|
||||||
_ol_render_canvas_.drawImage(context, transform, opacity, image, originX, originY, w, h, x, y, scale);
|
drawImage(context, transform, opacity, image, originX, originY, w, h, x, y, scale);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -463,7 +463,7 @@ CanvasReplay.prototype.fill_ = function(context) {
|
|||||||
}
|
}
|
||||||
context.fill();
|
context.fill();
|
||||||
if (this.fillOrigin_) {
|
if (this.fillOrigin_) {
|
||||||
context.setTransform.apply(context, _ol_render_canvas_.resetTransform_);
|
context.setTransform.apply(context, resetTransform);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -504,7 +504,6 @@ CanvasReplay.prototype.renderDeclutter_ = function(declutterGroup, feature) {
|
|||||||
};
|
};
|
||||||
if (!this.declutterTree.collides(box)) {
|
if (!this.declutterTree.collides(box)) {
|
||||||
this.declutterTree.insert(box);
|
this.declutterTree.insert(box);
|
||||||
const drawImage = _ol_render_canvas_.drawImage;
|
|
||||||
for (let j = 5, jj = declutterGroup.length; j < jj; ++j) {
|
for (let j = 5, jj = declutterGroup.length; j < jj; ++j) {
|
||||||
const declutterData = /** @type {Array} */ (declutterGroup[j]);
|
const declutterData = /** @type {Array} */ (declutterGroup[j]);
|
||||||
if (declutterData) {
|
if (declutterData) {
|
||||||
@@ -676,7 +675,7 @@ CanvasReplay.prototype.replay_ = function(
|
|||||||
backgroundFill = /** @type {boolean} */ (instruction[17]);
|
backgroundFill = /** @type {boolean} */ (instruction[17]);
|
||||||
backgroundStroke = /** @type {boolean} */ (instruction[18]);
|
backgroundStroke = /** @type {boolean} */ (instruction[18]);
|
||||||
} else {
|
} else {
|
||||||
padding = _ol_render_canvas_.defaultPadding;
|
padding = defaultPadding;
|
||||||
backgroundFill = backgroundStroke = false;
|
backgroundFill = backgroundStroke = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -730,7 +729,7 @@ CanvasReplay.prototype.replay_ = function(
|
|||||||
/** @type {number} */ (part[0]), /** @type {number} */ (part[1]), label,
|
/** @type {number} */ (part[0]), /** @type {number} */ (part[1]), label,
|
||||||
anchorX, anchorY, declutterGroup, label.height, 1, 0, 0,
|
anchorX, anchorY, declutterGroup, label.height, 1, 0, 0,
|
||||||
/** @type {number} */ (part[3]), textScale, false, label.width,
|
/** @type {number} */ (part[3]), textScale, false, label.width,
|
||||||
_ol_render_canvas_.defaultPadding, null, null);
|
defaultPadding, null, null);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if (fillKey) {
|
if (fillKey) {
|
||||||
@@ -744,7 +743,7 @@ CanvasReplay.prototype.replay_ = function(
|
|||||||
/** @type {number} */ (part[0]), /** @type {number} */ (part[1]), label,
|
/** @type {number} */ (part[0]), /** @type {number} */ (part[1]), label,
|
||||||
anchorX, anchorY, declutterGroup, label.height, 1, 0, 0,
|
anchorX, anchorY, declutterGroup, label.height, 1, 0, 0,
|
||||||
/** @type {number} */ (part[3]), textScale, false, label.width,
|
/** @type {number} */ (part[3]), textScale, false, label.width,
|
||||||
_ol_render_canvas_.defaultPadding, null, null);
|
defaultPadding, null, null);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -915,32 +914,32 @@ CanvasReplay.prototype.setFillStrokeStyle = function(fillStyle, strokeStyle) {
|
|||||||
if (fillStyle) {
|
if (fillStyle) {
|
||||||
const fillStyleColor = fillStyle.getColor();
|
const fillStyleColor = fillStyle.getColor();
|
||||||
state.fillStyle = asColorLike(fillStyleColor ?
|
state.fillStyle = asColorLike(fillStyleColor ?
|
||||||
fillStyleColor : _ol_render_canvas_.defaultFillStyle);
|
fillStyleColor : defaultFillStyle);
|
||||||
} else {
|
} else {
|
||||||
state.fillStyle = undefined;
|
state.fillStyle = undefined;
|
||||||
}
|
}
|
||||||
if (strokeStyle) {
|
if (strokeStyle) {
|
||||||
const strokeStyleColor = strokeStyle.getColor();
|
const strokeStyleColor = strokeStyle.getColor();
|
||||||
state.strokeStyle = asColorLike(strokeStyleColor ?
|
state.strokeStyle = asColorLike(strokeStyleColor ?
|
||||||
strokeStyleColor : _ol_render_canvas_.defaultStrokeStyle);
|
strokeStyleColor : defaultStrokeStyle);
|
||||||
const strokeStyleLineCap = strokeStyle.getLineCap();
|
const strokeStyleLineCap = strokeStyle.getLineCap();
|
||||||
state.lineCap = strokeStyleLineCap !== undefined ?
|
state.lineCap = strokeStyleLineCap !== undefined ?
|
||||||
strokeStyleLineCap : _ol_render_canvas_.defaultLineCap;
|
strokeStyleLineCap : defaultLineCap;
|
||||||
const strokeStyleLineDash = strokeStyle.getLineDash();
|
const strokeStyleLineDash = strokeStyle.getLineDash();
|
||||||
state.lineDash = strokeStyleLineDash ?
|
state.lineDash = strokeStyleLineDash ?
|
||||||
strokeStyleLineDash.slice() : _ol_render_canvas_.defaultLineDash;
|
strokeStyleLineDash.slice() : defaultLineDash;
|
||||||
const strokeStyleLineDashOffset = strokeStyle.getLineDashOffset();
|
const strokeStyleLineDashOffset = strokeStyle.getLineDashOffset();
|
||||||
state.lineDashOffset = strokeStyleLineDashOffset ?
|
state.lineDashOffset = strokeStyleLineDashOffset ?
|
||||||
strokeStyleLineDashOffset : _ol_render_canvas_.defaultLineDashOffset;
|
strokeStyleLineDashOffset : defaultLineDashOffset;
|
||||||
const strokeStyleLineJoin = strokeStyle.getLineJoin();
|
const strokeStyleLineJoin = strokeStyle.getLineJoin();
|
||||||
state.lineJoin = strokeStyleLineJoin !== undefined ?
|
state.lineJoin = strokeStyleLineJoin !== undefined ?
|
||||||
strokeStyleLineJoin : _ol_render_canvas_.defaultLineJoin;
|
strokeStyleLineJoin : defaultLineJoin;
|
||||||
const strokeStyleWidth = strokeStyle.getWidth();
|
const strokeStyleWidth = strokeStyle.getWidth();
|
||||||
state.lineWidth = strokeStyleWidth !== undefined ?
|
state.lineWidth = strokeStyleWidth !== undefined ?
|
||||||
strokeStyleWidth : _ol_render_canvas_.defaultLineWidth;
|
strokeStyleWidth : defaultLineWidth;
|
||||||
const strokeStyleMiterLimit = strokeStyle.getMiterLimit();
|
const strokeStyleMiterLimit = strokeStyle.getMiterLimit();
|
||||||
state.miterLimit = strokeStyleMiterLimit !== undefined ?
|
state.miterLimit = strokeStyleMiterLimit !== undefined ?
|
||||||
strokeStyleMiterLimit : _ol_render_canvas_.defaultMiterLimit;
|
strokeStyleMiterLimit : defaultMiterLimit;
|
||||||
|
|
||||||
if (state.lineWidth > this.maxLineWidth) {
|
if (state.lineWidth > this.maxLineWidth) {
|
||||||
this.maxLineWidth = state.lineWidth;
|
this.maxLineWidth = state.lineWidth;
|
||||||
|
|||||||
@@ -8,7 +8,7 @@ import {intersects} from '../../extent.js';
|
|||||||
import {matchingChunk} from '../../geom/flat/straightchunk.js';
|
import {matchingChunk} from '../../geom/flat/straightchunk.js';
|
||||||
import GeometryType from '../../geom/GeometryType.js';
|
import GeometryType from '../../geom/GeometryType.js';
|
||||||
import {CANVAS_LINE_DASH, SAFARI} from '../../has.js';
|
import {CANVAS_LINE_DASH, SAFARI} from '../../has.js';
|
||||||
import _ol_render_canvas_ from '../canvas.js';
|
import {labelCache, measureTextWidth, defaultTextAlign, measureTextHeight, defaultPadding, defaultLineCap, defaultLineDashOffset, defaultLineDash, defaultLineJoin, defaultFillStyle, checkFont, defaultFont, defaultLineWidth, defaultMiterLimit, defaultStrokeStyle, defaultTextBaseline} from '../canvas.js';
|
||||||
import CanvasInstruction from '../canvas/Instruction.js';
|
import CanvasInstruction from '../canvas/Instruction.js';
|
||||||
import CanvasReplay from '../canvas/Replay.js';
|
import CanvasReplay from '../canvas/Replay.js';
|
||||||
import _ol_render_replay_ from '../replay.js';
|
import _ol_render_replay_ from '../replay.js';
|
||||||
@@ -129,7 +129,6 @@ const CanvasTextReplay = function(
|
|||||||
*/
|
*/
|
||||||
this.widths_ = {};
|
this.widths_ = {};
|
||||||
|
|
||||||
const labelCache = _ol_render_canvas_.labelCache;
|
|
||||||
labelCache.prune();
|
labelCache.prune();
|
||||||
|
|
||||||
};
|
};
|
||||||
@@ -149,7 +148,7 @@ CanvasTextReplay.measureTextWidths = function(font, lines, widths) {
|
|||||||
let width = 0;
|
let width = 0;
|
||||||
let currentWidth, i;
|
let currentWidth, i;
|
||||||
for (i = 0; i < numLines; ++i) {
|
for (i = 0; i < numLines; ++i) {
|
||||||
currentWidth = _ol_render_canvas_.measureTextWidth(font, lines[i]);
|
currentWidth = measureTextWidth(font, lines[i]);
|
||||||
width = Math.max(width, currentWidth);
|
width = Math.max(width, currentWidth);
|
||||||
widths.push(currentWidth);
|
widths.push(currentWidth);
|
||||||
}
|
}
|
||||||
@@ -286,21 +285,20 @@ CanvasTextReplay.prototype.getImage = function(text, textKey, fillKey, strokeKey
|
|||||||
let label;
|
let label;
|
||||||
const key = strokeKey + textKey + text + fillKey + this.pixelRatio;
|
const key = strokeKey + textKey + text + fillKey + this.pixelRatio;
|
||||||
|
|
||||||
const labelCache = _ol_render_canvas_.labelCache;
|
|
||||||
if (!labelCache.containsKey(key)) {
|
if (!labelCache.containsKey(key)) {
|
||||||
const strokeState = strokeKey ? this.strokeStates[strokeKey] || this.textStrokeState_ : null;
|
const strokeState = strokeKey ? this.strokeStates[strokeKey] || this.textStrokeState_ : null;
|
||||||
const fillState = fillKey ? this.fillStates[fillKey] || this.textFillState_ : null;
|
const fillState = fillKey ? this.fillStates[fillKey] || this.textFillState_ : null;
|
||||||
const textState = this.textStates[textKey] || this.textState_;
|
const textState = this.textStates[textKey] || this.textState_;
|
||||||
const pixelRatio = this.pixelRatio;
|
const pixelRatio = this.pixelRatio;
|
||||||
const scale = textState.scale * pixelRatio;
|
const scale = textState.scale * pixelRatio;
|
||||||
const align = _ol_render_replay_.TEXT_ALIGN[textState.textAlign || _ol_render_canvas_.defaultTextAlign];
|
const align = _ol_render_replay_.TEXT_ALIGN[textState.textAlign || defaultTextAlign];
|
||||||
const strokeWidth = strokeKey && strokeState.lineWidth ? strokeState.lineWidth : 0;
|
const strokeWidth = strokeKey && strokeState.lineWidth ? strokeState.lineWidth : 0;
|
||||||
|
|
||||||
const lines = text.split('\n');
|
const lines = text.split('\n');
|
||||||
const numLines = lines.length;
|
const numLines = lines.length;
|
||||||
const widths = [];
|
const widths = [];
|
||||||
const width = CanvasTextReplay.measureTextWidths(textState.font, lines, widths);
|
const width = CanvasTextReplay.measureTextWidths(textState.font, lines, widths);
|
||||||
const lineHeight = _ol_render_canvas_.measureTextHeight(textState.font);
|
const lineHeight = measureTextHeight(textState.font);
|
||||||
const height = lineHeight * numLines;
|
const height = lineHeight * numLines;
|
||||||
const renderWidth = (width + strokeWidth);
|
const renderWidth = (width + strokeWidth);
|
||||||
const context = createCanvasContext2D(
|
const context = createCanvasContext2D(
|
||||||
@@ -356,7 +354,7 @@ CanvasTextReplay.prototype.drawTextImage_ = function(label, begin, end) {
|
|||||||
const textState = this.textState_;
|
const textState = this.textState_;
|
||||||
const strokeState = this.textStrokeState_;
|
const strokeState = this.textStrokeState_;
|
||||||
const pixelRatio = this.pixelRatio;
|
const pixelRatio = this.pixelRatio;
|
||||||
const align = _ol_render_replay_.TEXT_ALIGN[textState.textAlign || _ol_render_canvas_.defaultTextAlign];
|
const align = _ol_render_replay_.TEXT_ALIGN[textState.textAlign || defaultTextAlign];
|
||||||
const baseline = _ol_render_replay_.TEXT_ALIGN[textState.textBaseline];
|
const baseline = _ol_render_replay_.TEXT_ALIGN[textState.textBaseline];
|
||||||
const strokeWidth = strokeState && strokeState.lineWidth ? strokeState.lineWidth : 0;
|
const strokeWidth = strokeState && strokeState.lineWidth ? strokeState.lineWidth : 0;
|
||||||
|
|
||||||
@@ -366,8 +364,8 @@ CanvasTextReplay.prototype.drawTextImage_ = function(label, begin, end) {
|
|||||||
label, (anchorX - this.textOffsetX_) * pixelRatio, (anchorY - this.textOffsetY_) * pixelRatio,
|
label, (anchorX - this.textOffsetX_) * pixelRatio, (anchorY - this.textOffsetY_) * pixelRatio,
|
||||||
this.declutterGroup_, label.height, 1, 0, 0, this.textRotateWithView_, this.textRotation_,
|
this.declutterGroup_, label.height, 1, 0, 0, this.textRotateWithView_, this.textRotation_,
|
||||||
1, true, label.width,
|
1, true, label.width,
|
||||||
textState.padding == _ol_render_canvas_.defaultPadding ?
|
textState.padding == defaultPadding ?
|
||||||
_ol_render_canvas_.defaultPadding : textState.padding.map(function(p) {
|
defaultPadding : textState.padding.map(function(p) {
|
||||||
return p * pixelRatio;
|
return p * pixelRatio;
|
||||||
}),
|
}),
|
||||||
!!textState.backgroundFill, !!textState.backgroundStroke
|
!!textState.backgroundFill, !!textState.backgroundStroke
|
||||||
@@ -410,7 +408,7 @@ CanvasTextReplay.prototype.drawChars_ = function(begin, end, declutterGroup) {
|
|||||||
if (!(this.textKey_ in this.textStates)) {
|
if (!(this.textKey_ in this.textStates)) {
|
||||||
this.textStates[this.textKey_] = /** @type {ol.CanvasTextState} */ ({
|
this.textStates[this.textKey_] = /** @type {ol.CanvasTextState} */ ({
|
||||||
font: textState.font,
|
font: textState.font,
|
||||||
textAlign: textState.textAlign || _ol_render_canvas_.defaultTextAlign,
|
textAlign: textState.textAlign || defaultTextAlign,
|
||||||
scale: textState.scale
|
scale: textState.scale
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -441,7 +439,7 @@ CanvasTextReplay.prototype.drawChars_ = function(begin, end, declutterGroup) {
|
|||||||
function(text) {
|
function(text) {
|
||||||
let width = widths[text];
|
let width = widths[text];
|
||||||
if (!width) {
|
if (!width) {
|
||||||
width = widths[text] = _ol_render_canvas_.measureTextWidth(font, text);
|
width = widths[text] = measureTextWidth(font, text);
|
||||||
}
|
}
|
||||||
return width * textScale * pixelRatio;
|
return width * textScale * pixelRatio;
|
||||||
},
|
},
|
||||||
@@ -453,7 +451,7 @@ CanvasTextReplay.prototype.drawChars_ = function(begin, end, declutterGroup) {
|
|||||||
function(text) {
|
function(text) {
|
||||||
let width = widths[text];
|
let width = widths[text];
|
||||||
if (!width) {
|
if (!width) {
|
||||||
width = widths[text] = _ol_render_canvas_.measureTextWidth(font, text);
|
width = widths[text] = measureTextWidth(font, text);
|
||||||
}
|
}
|
||||||
return width * textScale;
|
return width * textScale;
|
||||||
},
|
},
|
||||||
@@ -481,7 +479,7 @@ CanvasTextReplay.prototype.setTextStyle = function(textStyle, declutterGroup) {
|
|||||||
fillState = this.textFillState_ = /** @type {ol.CanvasFillState} */ ({});
|
fillState = this.textFillState_ = /** @type {ol.CanvasFillState} */ ({});
|
||||||
}
|
}
|
||||||
fillState.fillStyle = asColorLike(
|
fillState.fillStyle = asColorLike(
|
||||||
textFillStyle.getColor() || _ol_render_canvas_.defaultFillStyle);
|
textFillStyle.getColor() || defaultFillStyle);
|
||||||
}
|
}
|
||||||
|
|
||||||
const textStrokeStyle = textStyle.getStroke();
|
const textStrokeStyle = textStyle.getStroke();
|
||||||
@@ -496,32 +494,32 @@ CanvasTextReplay.prototype.setTextStyle = function(textStyle, declutterGroup) {
|
|||||||
const lineDashOffset = textStrokeStyle.getLineDashOffset();
|
const lineDashOffset = textStrokeStyle.getLineDashOffset();
|
||||||
const lineWidth = textStrokeStyle.getWidth();
|
const lineWidth = textStrokeStyle.getWidth();
|
||||||
const miterLimit = textStrokeStyle.getMiterLimit();
|
const miterLimit = textStrokeStyle.getMiterLimit();
|
||||||
strokeState.lineCap = textStrokeStyle.getLineCap() || _ol_render_canvas_.defaultLineCap;
|
strokeState.lineCap = textStrokeStyle.getLineCap() || defaultLineCap;
|
||||||
strokeState.lineDash = lineDash ? lineDash.slice() : _ol_render_canvas_.defaultLineDash;
|
strokeState.lineDash = lineDash ? lineDash.slice() : defaultLineDash;
|
||||||
strokeState.lineDashOffset =
|
strokeState.lineDashOffset =
|
||||||
lineDashOffset === undefined ? _ol_render_canvas_.defaultLineDashOffset : lineDashOffset;
|
lineDashOffset === undefined ? defaultLineDashOffset : lineDashOffset;
|
||||||
strokeState.lineJoin = textStrokeStyle.getLineJoin() || _ol_render_canvas_.defaultLineJoin;
|
strokeState.lineJoin = textStrokeStyle.getLineJoin() || defaultLineJoin;
|
||||||
strokeState.lineWidth =
|
strokeState.lineWidth =
|
||||||
lineWidth === undefined ? _ol_render_canvas_.defaultLineWidth : lineWidth;
|
lineWidth === undefined ? defaultLineWidth : lineWidth;
|
||||||
strokeState.miterLimit =
|
strokeState.miterLimit =
|
||||||
miterLimit === undefined ? _ol_render_canvas_.defaultMiterLimit : miterLimit;
|
miterLimit === undefined ? defaultMiterLimit : miterLimit;
|
||||||
strokeState.strokeStyle = asColorLike(
|
strokeState.strokeStyle = asColorLike(
|
||||||
textStrokeStyle.getColor() || _ol_render_canvas_.defaultStrokeStyle);
|
textStrokeStyle.getColor() || defaultStrokeStyle);
|
||||||
}
|
}
|
||||||
|
|
||||||
textState = this.textState_;
|
textState = this.textState_;
|
||||||
const font = textStyle.getFont() || _ol_render_canvas_.defaultFont;
|
const font = textStyle.getFont() || defaultFont;
|
||||||
_ol_render_canvas_.checkFont(font);
|
checkFont(font);
|
||||||
const textScale = textStyle.getScale();
|
const textScale = textStyle.getScale();
|
||||||
textState.overflow = textStyle.getOverflow();
|
textState.overflow = textStyle.getOverflow();
|
||||||
textState.font = font;
|
textState.font = font;
|
||||||
textState.maxAngle = textStyle.getMaxAngle();
|
textState.maxAngle = textStyle.getMaxAngle();
|
||||||
textState.placement = textStyle.getPlacement();
|
textState.placement = textStyle.getPlacement();
|
||||||
textState.textAlign = textStyle.getTextAlign();
|
textState.textAlign = textStyle.getTextAlign();
|
||||||
textState.textBaseline = textStyle.getTextBaseline() || _ol_render_canvas_.defaultTextBaseline;
|
textState.textBaseline = textStyle.getTextBaseline() || defaultTextBaseline;
|
||||||
textState.backgroundFill = textStyle.getBackgroundFill();
|
textState.backgroundFill = textStyle.getBackgroundFill();
|
||||||
textState.backgroundStroke = textStyle.getBackgroundStroke();
|
textState.backgroundStroke = textStyle.getBackgroundStroke();
|
||||||
textState.padding = textStyle.getPadding() || _ol_render_canvas_.defaultPadding;
|
textState.padding = textStyle.getPadding() || defaultPadding;
|
||||||
textState.scale = textScale === undefined ? 1 : textScale;
|
textState.scale = textScale === undefined ? 1 : textScale;
|
||||||
|
|
||||||
const textOffsetX = textStyle.getOffsetX();
|
const textOffsetX = textStyle.getOffsetX();
|
||||||
|
|||||||
@@ -6,7 +6,7 @@ import {getBottomLeft, getBottomRight, getTopLeft, getTopRight} from '../../exte
|
|||||||
import {TRUE} from '../../functions.js';
|
import {TRUE} from '../../functions.js';
|
||||||
import RenderEvent from '../../render/Event.js';
|
import RenderEvent from '../../render/Event.js';
|
||||||
import RenderEventType from '../../render/EventType.js';
|
import RenderEventType from '../../render/EventType.js';
|
||||||
import _ol_render_canvas_ from '../../render/canvas.js';
|
import {rotateAtOffset} from '../../render/canvas.js';
|
||||||
import CanvasImmediateRenderer from '../../render/canvas/Immediate.js';
|
import CanvasImmediateRenderer from '../../render/canvas/Immediate.js';
|
||||||
import LayerRenderer from '../Layer.js';
|
import LayerRenderer from '../Layer.js';
|
||||||
import _ol_transform_ from '../../transform.js';
|
import _ol_transform_ from '../../transform.js';
|
||||||
@@ -60,14 +60,14 @@ CanvasLayerRenderer.prototype.clip = function(context, frameState, extent) {
|
|||||||
_ol_transform_.apply(frameState.coordinateToPixelTransform, bottomLeft);
|
_ol_transform_.apply(frameState.coordinateToPixelTransform, bottomLeft);
|
||||||
|
|
||||||
context.save();
|
context.save();
|
||||||
_ol_render_canvas_.rotateAtOffset(context, -rotation, width / 2, height / 2);
|
rotateAtOffset(context, -rotation, width / 2, height / 2);
|
||||||
context.beginPath();
|
context.beginPath();
|
||||||
context.moveTo(topLeft[0] * pixelRatio, topLeft[1] * pixelRatio);
|
context.moveTo(topLeft[0] * pixelRatio, topLeft[1] * pixelRatio);
|
||||||
context.lineTo(topRight[0] * pixelRatio, topRight[1] * pixelRatio);
|
context.lineTo(topRight[0] * pixelRatio, topRight[1] * pixelRatio);
|
||||||
context.lineTo(bottomRight[0] * pixelRatio, bottomRight[1] * pixelRatio);
|
context.lineTo(bottomRight[0] * pixelRatio, bottomRight[1] * pixelRatio);
|
||||||
context.lineTo(bottomLeft[0] * pixelRatio, bottomLeft[1] * pixelRatio);
|
context.lineTo(bottomLeft[0] * pixelRatio, bottomLeft[1] * pixelRatio);
|
||||||
context.clip();
|
context.clip();
|
||||||
_ol_render_canvas_.rotateAtOffset(context, rotation, width / 2, height / 2);
|
rotateAtOffset(context, rotation, width / 2, height / 2);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
@@ -84,7 +84,7 @@ CanvasLayerRenderer.prototype.dispatchComposeEvent_ = function(type, context, fr
|
|||||||
const width = frameState.size[0] * frameState.pixelRatio;
|
const width = frameState.size[0] * frameState.pixelRatio;
|
||||||
const height = frameState.size[1] * frameState.pixelRatio;
|
const height = frameState.size[1] * frameState.pixelRatio;
|
||||||
const rotation = frameState.viewState.rotation;
|
const rotation = frameState.viewState.rotation;
|
||||||
_ol_render_canvas_.rotateAtOffset(context, -rotation, width / 2, height / 2);
|
rotateAtOffset(context, -rotation, width / 2, height / 2);
|
||||||
const transform = opt_transform !== undefined ?
|
const transform = opt_transform !== undefined ?
|
||||||
opt_transform : this.getTransform(frameState, 0);
|
opt_transform : this.getTransform(frameState, 0);
|
||||||
const render = new CanvasImmediateRenderer(
|
const render = new CanvasImmediateRenderer(
|
||||||
@@ -93,7 +93,7 @@ CanvasLayerRenderer.prototype.dispatchComposeEvent_ = function(type, context, fr
|
|||||||
const composeEvent = new RenderEvent(type, render, frameState,
|
const composeEvent = new RenderEvent(type, render, frameState,
|
||||||
context, null);
|
context, null);
|
||||||
layer.dispatchEvent(composeEvent);
|
layer.dispatchEvent(composeEvent);
|
||||||
_ol_render_canvas_.rotateAtOffset(context, rotation, width / 2, height / 2);
|
rotateAtOffset(context, rotation, width / 2, height / 2);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -11,7 +11,7 @@ import {createCanvasContext2D} from '../../dom.js';
|
|||||||
import {visibleAtResolution} from '../../layer/Layer.js';
|
import {visibleAtResolution} from '../../layer/Layer.js';
|
||||||
import RenderEvent from '../../render/Event.js';
|
import RenderEvent from '../../render/Event.js';
|
||||||
import RenderEventType from '../../render/EventType.js';
|
import RenderEventType from '../../render/EventType.js';
|
||||||
import _ol_render_canvas_ from '../../render/canvas.js';
|
import {rotateAtOffset} from '../../render/canvas.js';
|
||||||
import CanvasImmediateRenderer from '../../render/canvas/Immediate.js';
|
import CanvasImmediateRenderer from '../../render/canvas/Immediate.js';
|
||||||
import MapRenderer, {sortByZIndex} from '../Map.js';
|
import MapRenderer, {sortByZIndex} from '../Map.js';
|
||||||
import RendererType from '../Type.js';
|
import RendererType from '../Type.js';
|
||||||
@@ -170,7 +170,7 @@ CanvasMapRenderer.prototype.renderFrame = function(frameState) {
|
|||||||
|
|
||||||
if (rotation) {
|
if (rotation) {
|
||||||
context.save();
|
context.save();
|
||||||
_ol_render_canvas_.rotateAtOffset(context, rotation, width / 2, height / 2);
|
rotateAtOffset(context, rotation, width / 2, height / 2);
|
||||||
}
|
}
|
||||||
|
|
||||||
const viewResolution = frameState.viewState.resolution;
|
const viewResolution = frameState.viewState.resolution;
|
||||||
|
|||||||
@@ -10,7 +10,7 @@ import EventType from '../../events/EventType.js';
|
|||||||
import rbush from 'rbush';
|
import rbush from 'rbush';
|
||||||
import {buffer, createEmpty, containsExtent, getWidth} from '../../extent.js';
|
import {buffer, createEmpty, containsExtent, getWidth} from '../../extent.js';
|
||||||
import RenderEventType from '../../render/EventType.js';
|
import RenderEventType from '../../render/EventType.js';
|
||||||
import _ol_render_canvas_ from '../../render/canvas.js';
|
import {labelCache, rotateAtOffset} from '../../render/canvas.js';
|
||||||
import CanvasReplayGroup from '../../render/canvas/ReplayGroup.js';
|
import CanvasReplayGroup from '../../render/canvas/ReplayGroup.js';
|
||||||
import RendererType from '../Type.js';
|
import RendererType from '../Type.js';
|
||||||
import CanvasLayerRenderer from '../canvas/Layer.js';
|
import CanvasLayerRenderer from '../canvas/Layer.js';
|
||||||
@@ -79,7 +79,7 @@ const CanvasVectorLayerRenderer = function(vectorLayer) {
|
|||||||
*/
|
*/
|
||||||
this.context = createCanvasContext2D();
|
this.context = createCanvasContext2D();
|
||||||
|
|
||||||
listen(_ol_render_canvas_.labelCache, EventType.CLEAR, this.handleFontsChanged_, this);
|
listen(labelCache, EventType.CLEAR, this.handleFontsChanged_, this);
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -112,7 +112,7 @@ CanvasVectorLayerRenderer['create'] = function(mapRenderer, layer) {
|
|||||||
* @inheritDoc
|
* @inheritDoc
|
||||||
*/
|
*/
|
||||||
CanvasVectorLayerRenderer.prototype.disposeInternal = function() {
|
CanvasVectorLayerRenderer.prototype.disposeInternal = function() {
|
||||||
unlisten(_ol_render_canvas_.labelCache, EventType.CLEAR, this.handleFontsChanged_, this);
|
unlisten(labelCache, EventType.CLEAR, this.handleFontsChanged_, this);
|
||||||
CanvasLayerRenderer.prototype.disposeInternal.call(this);
|
CanvasLayerRenderer.prototype.disposeInternal.call(this);
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -184,7 +184,7 @@ CanvasVectorLayerRenderer.prototype.composeFrame = function(frameState, layerSta
|
|||||||
|
|
||||||
const width = frameState.size[0] * pixelRatio;
|
const width = frameState.size[0] * pixelRatio;
|
||||||
const height = frameState.size[1] * pixelRatio;
|
const height = frameState.size[1] * pixelRatio;
|
||||||
_ol_render_canvas_.rotateAtOffset(replayContext, -rotation,
|
rotateAtOffset(replayContext, -rotation,
|
||||||
width / 2, height / 2);
|
width / 2, height / 2);
|
||||||
replayGroup.replay(replayContext, transform, rotation, skippedFeatureUids);
|
replayGroup.replay(replayContext, transform, rotation, skippedFeatureUids);
|
||||||
if (vectorSource.getWrapX() && projection.canWrapX() &&
|
if (vectorSource.getWrapX() && projection.canWrapX() &&
|
||||||
@@ -212,7 +212,7 @@ CanvasVectorLayerRenderer.prototype.composeFrame = function(frameState, layerSta
|
|||||||
// restore original transform for render and compose events
|
// restore original transform for render and compose events
|
||||||
transform = this.getTransform(frameState, 0);
|
transform = this.getTransform(frameState, 0);
|
||||||
}
|
}
|
||||||
_ol_render_canvas_.rotateAtOffset(replayContext, rotation,
|
rotateAtOffset(replayContext, rotation,
|
||||||
width / 2, height / 2);
|
width / 2, height / 2);
|
||||||
|
|
||||||
if (replayContext != context) {
|
if (replayContext != context) {
|
||||||
|
|||||||
@@ -13,7 +13,7 @@ import _ol_layer_VectorTileRenderType_ from '../../layer/VectorTileRenderType.js
|
|||||||
import {equivalent as equivalentProjection} from '../../proj.js';
|
import {equivalent as equivalentProjection} from '../../proj.js';
|
||||||
import Units from '../../proj/Units.js';
|
import Units from '../../proj/Units.js';
|
||||||
import ReplayType from '../../render/ReplayType.js';
|
import ReplayType from '../../render/ReplayType.js';
|
||||||
import _ol_render_canvas_ from '../../render/canvas.js';
|
import {labelCache, rotateAtOffset} from '../../render/canvas.js';
|
||||||
import CanvasReplayGroup from '../../render/canvas/ReplayGroup.js';
|
import CanvasReplayGroup from '../../render/canvas/ReplayGroup.js';
|
||||||
import _ol_render_replay_ from '../../render/replay.js';
|
import _ol_render_replay_ from '../../render/replay.js';
|
||||||
import RendererType from '../Type.js';
|
import RendererType from '../Type.js';
|
||||||
@@ -85,7 +85,7 @@ const CanvasVectorTileLayerRenderer = function(layer) {
|
|||||||
this.zDirection =
|
this.zDirection =
|
||||||
layer.getRenderMode() == _ol_layer_VectorTileRenderType_.VECTOR ? 1 : 0;
|
layer.getRenderMode() == _ol_layer_VectorTileRenderType_.VECTOR ? 1 : 0;
|
||||||
|
|
||||||
listen(_ol_render_canvas_.labelCache, EventType.CLEAR, this.handleFontsChanged_, this);
|
listen(labelCache, EventType.CLEAR, this.handleFontsChanged_, this);
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -118,7 +118,7 @@ CanvasVectorTileLayerRenderer['create'] = function(mapRenderer, layer) {
|
|||||||
* @inheritDoc
|
* @inheritDoc
|
||||||
*/
|
*/
|
||||||
CanvasVectorTileLayerRenderer.prototype.disposeInternal = function() {
|
CanvasVectorTileLayerRenderer.prototype.disposeInternal = function() {
|
||||||
unlisten(_ol_render_canvas_.labelCache, EventType.CLEAR, this.handleFontsChanged_, this);
|
unlisten(labelCache, EventType.CLEAR, this.handleFontsChanged_, this);
|
||||||
CanvasTileLayerRenderer.prototype.disposeInternal.call(this);
|
CanvasTileLayerRenderer.prototype.disposeInternal.call(this);
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -374,7 +374,7 @@ CanvasVectorTileLayerRenderer.prototype.postCompose = function(context, frameSta
|
|||||||
if (rotation) {
|
if (rotation) {
|
||||||
offsetX = Math.round(pixelRatio * size[0] / 2);
|
offsetX = Math.round(pixelRatio * size[0] / 2);
|
||||||
offsetY = Math.round(pixelRatio * size[1] / 2);
|
offsetY = Math.round(pixelRatio * size[1] / 2);
|
||||||
_ol_render_canvas_.rotateAtOffset(context, -rotation, offsetX, offsetY);
|
rotateAtOffset(context, -rotation, offsetX, offsetY);
|
||||||
}
|
}
|
||||||
if (declutterReplays) {
|
if (declutterReplays) {
|
||||||
this.declutterTree_.clear();
|
this.declutterTree_.clear();
|
||||||
@@ -437,7 +437,7 @@ CanvasVectorTileLayerRenderer.prototype.postCompose = function(context, frameSta
|
|||||||
CanvasReplayGroup.replayDeclutter(declutterReplays, context, rotation);
|
CanvasReplayGroup.replayDeclutter(declutterReplays, context, rotation);
|
||||||
}
|
}
|
||||||
if (rotation) {
|
if (rotation) {
|
||||||
_ol_render_canvas_.rotateAtOffset(context, rotation,
|
rotateAtOffset(context, rotation,
|
||||||
/** @type {number} */ (offsetX), /** @type {number} */ (offsetY));
|
/** @type {number} */ (offsetX), /** @type {number} */ (offsetY));
|
||||||
}
|
}
|
||||||
CanvasTileLayerRenderer.prototype.postCompose.apply(this, arguments);
|
CanvasTileLayerRenderer.prototype.postCompose.apply(this, arguments);
|
||||||
|
|||||||
@@ -6,7 +6,7 @@ import {asColorLike} from '../colorlike.js';
|
|||||||
import {createCanvasContext2D} from '../dom.js';
|
import {createCanvasContext2D} from '../dom.js';
|
||||||
import {CANVAS_LINE_DASH} from '../has.js';
|
import {CANVAS_LINE_DASH} from '../has.js';
|
||||||
import ImageState from '../ImageState.js';
|
import ImageState from '../ImageState.js';
|
||||||
import _ol_render_canvas_ from '../render/canvas.js';
|
import {defaultStrokeStyle, defaultFillStyle, defaultLineCap, defaultLineWidth, defaultLineJoin, defaultMiterLimit} from '../render/canvas.js';
|
||||||
import ImageStyle from '../style/Image.js';
|
import ImageStyle from '../style/Image.js';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -325,12 +325,12 @@ RegularShape.prototype.render_ = function(atlasManager) {
|
|||||||
if (this.stroke_) {
|
if (this.stroke_) {
|
||||||
strokeStyle = this.stroke_.getColor();
|
strokeStyle = this.stroke_.getColor();
|
||||||
if (strokeStyle === null) {
|
if (strokeStyle === null) {
|
||||||
strokeStyle = _ol_render_canvas_.defaultStrokeStyle;
|
strokeStyle = defaultStrokeStyle;
|
||||||
}
|
}
|
||||||
strokeStyle = asColorLike(strokeStyle);
|
strokeStyle = asColorLike(strokeStyle);
|
||||||
strokeWidth = this.stroke_.getWidth();
|
strokeWidth = this.stroke_.getWidth();
|
||||||
if (strokeWidth === undefined) {
|
if (strokeWidth === undefined) {
|
||||||
strokeWidth = _ol_render_canvas_.defaultLineWidth;
|
strokeWidth = defaultLineWidth;
|
||||||
}
|
}
|
||||||
lineDash = this.stroke_.getLineDash();
|
lineDash = this.stroke_.getLineDash();
|
||||||
lineDashOffset = this.stroke_.getLineDashOffset();
|
lineDashOffset = this.stroke_.getLineDashOffset();
|
||||||
@@ -340,15 +340,15 @@ RegularShape.prototype.render_ = function(atlasManager) {
|
|||||||
}
|
}
|
||||||
lineJoin = this.stroke_.getLineJoin();
|
lineJoin = this.stroke_.getLineJoin();
|
||||||
if (lineJoin === undefined) {
|
if (lineJoin === undefined) {
|
||||||
lineJoin = _ol_render_canvas_.defaultLineJoin;
|
lineJoin = defaultLineJoin;
|
||||||
}
|
}
|
||||||
lineCap = this.stroke_.getLineCap();
|
lineCap = this.stroke_.getLineCap();
|
||||||
if (lineCap === undefined) {
|
if (lineCap === undefined) {
|
||||||
lineCap = _ol_render_canvas_.defaultLineCap;
|
lineCap = defaultLineCap;
|
||||||
}
|
}
|
||||||
miterLimit = this.stroke_.getMiterLimit();
|
miterLimit = this.stroke_.getMiterLimit();
|
||||||
if (miterLimit === undefined) {
|
if (miterLimit === undefined) {
|
||||||
miterLimit = _ol_render_canvas_.defaultMiterLimit;
|
miterLimit = defaultMiterLimit;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -455,7 +455,7 @@ RegularShape.prototype.draw_ = function(renderOptions, context, x, y) {
|
|||||||
if (this.fill_) {
|
if (this.fill_) {
|
||||||
let color = this.fill_.getColor();
|
let color = this.fill_.getColor();
|
||||||
if (color === null) {
|
if (color === null) {
|
||||||
color = _ol_render_canvas_.defaultFillStyle;
|
color = defaultFillStyle;
|
||||||
}
|
}
|
||||||
context.fillStyle = asColorLike(color);
|
context.fillStyle = asColorLike(color);
|
||||||
context.fill();
|
context.fill();
|
||||||
@@ -532,7 +532,7 @@ RegularShape.prototype.drawHitDetectionCanvas_ = function(renderOptions, context
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
context.fillStyle = _ol_render_canvas_.defaultFillStyle;
|
context.fillStyle = defaultFillStyle;
|
||||||
context.fill();
|
context.fill();
|
||||||
if (this.stroke_) {
|
if (this.stroke_) {
|
||||||
context.strokeStyle = renderOptions.strokeStyle;
|
context.strokeStyle = renderOptions.strokeStyle;
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import {listen, unlisten} from '../../../../../src/ol/events.js';
|
import {listen, unlisten} from '../../../../../src/ol/events.js';
|
||||||
import {clear} from '../../../../../src/ol/obj.js';
|
import {clear} from '../../../../../src/ol/obj.js';
|
||||||
import _ol_render_canvas_ from '../../../../../src/ol/render/canvas.js';
|
import * as render from '../../../../../src/ol/render/canvas.js';
|
||||||
|
|
||||||
|
|
||||||
describe('ol.render.canvas', function() {
|
describe('ol.render.canvas', function() {
|
||||||
@@ -13,71 +13,65 @@ describe('ol.render.canvas', function() {
|
|||||||
describe('ol.render.canvas.checkFont()', function() {
|
describe('ol.render.canvas.checkFont()', function() {
|
||||||
|
|
||||||
beforeEach(function() {
|
beforeEach(function() {
|
||||||
clear(_ol_render_canvas_.checkedFonts_);
|
clear(render.checkedFonts);
|
||||||
_ol_render_canvas_.getMeasureContext();
|
render.measureTextHeight('12px sans-serif');
|
||||||
_ol_render_canvas_.measureTextHeight('12px sans-serif');
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const checkFont = _ol_render_canvas_.checkFont;
|
|
||||||
const retries = 60;
|
const retries = 60;
|
||||||
|
|
||||||
it('does not clear label cache and measurements for unavailable fonts', function(done) {
|
it('does not clear label cache and measurements for unavailable fonts', function(done) {
|
||||||
this.timeout(3000);
|
this.timeout(3000);
|
||||||
const spy = sinon.spy();
|
const spy = sinon.spy();
|
||||||
listen(_ol_render_canvas_.labelCache, 'clear', spy);
|
listen(render.labelCache, 'clear', spy);
|
||||||
const interval = setInterval(function() {
|
const interval = setInterval(function() {
|
||||||
if (_ol_render_canvas_.checkedFonts_['foo'] == retries && _ol_render_canvas_.checkedFonts_['sans-serif'] == retries) {
|
if (render.checkedFonts['foo'] == retries && render.checkedFonts['sans-serif'] == retries) {
|
||||||
clearInterval(interval);
|
clearInterval(interval);
|
||||||
unlisten(_ol_render_canvas_.labelCache, 'clear', spy);
|
unlisten(render.labelCache, 'clear', spy);
|
||||||
expect(spy.callCount).to.be(0);
|
expect(spy.callCount).to.be(0);
|
||||||
expect(_ol_render_canvas_.measureContext_).to.not.be(null);
|
expect(render.textHeights).to.not.eql({});
|
||||||
expect(_ol_render_canvas_.textHeights_).to.not.eql({});
|
|
||||||
done();
|
done();
|
||||||
}
|
}
|
||||||
}, 32);
|
}, 32);
|
||||||
checkFont('12px foo,sans-serif');
|
render.checkFont('12px foo,sans-serif');
|
||||||
});
|
});
|
||||||
|
|
||||||
it('does not clear label cache and measurements for available fonts', function(done) {
|
it('does not clear label cache and measurements for available fonts', function(done) {
|
||||||
const spy = sinon.spy();
|
const spy = sinon.spy();
|
||||||
listen(_ol_render_canvas_.labelCache, 'clear', spy);
|
listen(render.labelCache, 'clear', spy);
|
||||||
const interval = setInterval(function() {
|
const interval = setInterval(function() {
|
||||||
if (_ol_render_canvas_.checkedFonts_['sans-serif'] == retries) {
|
if (render.checkedFonts['sans-serif'] == retries) {
|
||||||
clearInterval(interval);
|
clearInterval(interval);
|
||||||
unlisten(_ol_render_canvas_.labelCache, 'clear', spy);
|
unlisten(render.labelCache, 'clear', spy);
|
||||||
expect(spy.callCount).to.be(0);
|
expect(spy.callCount).to.be(0);
|
||||||
expect(_ol_render_canvas_.measureContext_).to.not.be(null);
|
expect(render.textHeights).to.not.eql({});
|
||||||
expect(_ol_render_canvas_.textHeights_).to.not.eql({});
|
|
||||||
done();
|
done();
|
||||||
}
|
}
|
||||||
}, 32);
|
}, 32);
|
||||||
checkFont('12px sans-serif');
|
render.checkFont('12px sans-serif');
|
||||||
});
|
});
|
||||||
|
|
||||||
it('does not clear label cache and measurements for the \'monospace\' font', function(done) {
|
it('does not clear label cache and measurements for the \'monospace\' font', function(done) {
|
||||||
const spy = sinon.spy();
|
const spy = sinon.spy();
|
||||||
listen(_ol_render_canvas_.labelCache, 'clear', spy);
|
listen(render.labelCache, 'clear', spy);
|
||||||
const interval = setInterval(function() {
|
const interval = setInterval(function() {
|
||||||
if (_ol_render_canvas_.checkedFonts_['monospace'] == retries) {
|
if (render.checkedFonts['monospace'] == retries) {
|
||||||
clearInterval(interval);
|
clearInterval(interval);
|
||||||
unlisten(_ol_render_canvas_.labelCache, 'clear', spy);
|
unlisten(render.labelCache, 'clear', spy);
|
||||||
expect(spy.callCount).to.be(0);
|
expect(spy.callCount).to.be(0);
|
||||||
expect(_ol_render_canvas_.measureContext_).to.not.be(null);
|
expect(render.textHeights).to.not.eql({});
|
||||||
expect(_ol_render_canvas_.textHeights_).to.not.eql({});
|
|
||||||
done();
|
done();
|
||||||
}
|
}
|
||||||
}, 32);
|
}, 32);
|
||||||
checkFont('12px monospace');
|
render.checkFont('12px monospace');
|
||||||
});
|
});
|
||||||
|
|
||||||
it('clears label cache and measurements for fonts that become available', function(done) {
|
it('clears label cache and measurements for fonts that become available', function(done) {
|
||||||
head.appendChild(font);
|
head.appendChild(font);
|
||||||
listen(_ol_render_canvas_.labelCache, 'clear', function() {
|
listen(render.labelCache, 'clear', function() {
|
||||||
expect(_ol_render_canvas_.measureContext_).to.be(null);
|
expect(render.textHeights).to.eql({});
|
||||||
expect(_ol_render_canvas_.textHeights_).to.eql({});
|
|
||||||
done();
|
done();
|
||||||
});
|
});
|
||||||
checkFont('12px Abel');
|
render.checkFont('12px Abel');
|
||||||
});
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
@@ -89,7 +83,7 @@ describe('ol.render.canvas', function() {
|
|||||||
translate: sinon.spy(),
|
translate: sinon.spy(),
|
||||||
rotate: sinon.spy()
|
rotate: sinon.spy()
|
||||||
};
|
};
|
||||||
_ol_render_canvas_.rotateAtOffset(context, Math.PI, 10, 10);
|
render.rotateAtOffset(context, Math.PI, 10, 10);
|
||||||
expect(context.translate.callCount).to.be(2);
|
expect(context.translate.callCount).to.be(2);
|
||||||
expect(context.translate.firstCall.args).to.eql([10, 10]);
|
expect(context.translate.firstCall.args).to.eql([10, 10]);
|
||||||
expect(context.translate.secondCall.args).to.eql([-10, -10]);
|
expect(context.translate.secondCall.args).to.eql([-10, -10]);
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ import Point from '../../../../../src/ol/geom/Point.js';
|
|||||||
import VectorLayer from '../../../../../src/ol/layer/Vector.js';
|
import VectorLayer from '../../../../../src/ol/layer/Vector.js';
|
||||||
import {clear} from '../../../../../src/ol/obj.js';
|
import {clear} from '../../../../../src/ol/obj.js';
|
||||||
import {get as getProjection} from '../../../../../src/ol/proj.js';
|
import {get as getProjection} from '../../../../../src/ol/proj.js';
|
||||||
import _ol_render_canvas_ from '../../../../../src/ol/render/canvas.js';
|
import {checkedFonts} from '../../../../../src/ol/render/canvas.js';
|
||||||
import CanvasVectorLayerRenderer from '../../../../../src/ol/renderer/canvas/VectorLayer.js';
|
import CanvasVectorLayerRenderer from '../../../../../src/ol/renderer/canvas/VectorLayer.js';
|
||||||
import VectorSource from '../../../../../src/ol/source/Vector.js';
|
import VectorSource from '../../../../../src/ol/source/Vector.js';
|
||||||
import Style from '../../../../../src/ol/style/Style.js';
|
import Style from '../../../../../src/ol/style/Style.js';
|
||||||
@@ -85,7 +85,7 @@ describe('ol.renderer.canvas.VectorLayer', function() {
|
|||||||
});
|
});
|
||||||
|
|
||||||
it('does not re-render for unavailable fonts', function(done) {
|
it('does not re-render for unavailable fonts', function(done) {
|
||||||
clear(_ol_render_canvas_.checkedFonts_);
|
clear(checkedFonts);
|
||||||
const map = new Map({
|
const map = new Map({
|
||||||
view: new View({
|
view: new View({
|
||||||
center: [0, 0],
|
center: [0, 0],
|
||||||
@@ -116,7 +116,7 @@ describe('ol.renderer.canvas.VectorLayer', function() {
|
|||||||
});
|
});
|
||||||
|
|
||||||
it('does not re-render for available fonts', function(done) {
|
it('does not re-render for available fonts', function(done) {
|
||||||
clear(_ol_render_canvas_.checkedFonts_);
|
clear(checkedFonts);
|
||||||
const map = new Map({
|
const map = new Map({
|
||||||
view: new View({
|
view: new View({
|
||||||
center: [0, 0],
|
center: [0, 0],
|
||||||
@@ -147,7 +147,7 @@ describe('ol.renderer.canvas.VectorLayer', function() {
|
|||||||
});
|
});
|
||||||
|
|
||||||
it('re-renders for fonts that become available', function(done) {
|
it('re-renders for fonts that become available', function(done) {
|
||||||
clear(_ol_render_canvas_.checkedFonts_);
|
clear(checkedFonts);
|
||||||
head.appendChild(font);
|
head.appendChild(font);
|
||||||
const map = new Map({
|
const map = new Map({
|
||||||
view: new View({
|
view: new View({
|
||||||
|
|||||||
@@ -12,7 +12,7 @@ import Point from '../../../../../src/ol/geom/Point.js';
|
|||||||
import VectorTileLayer from '../../../../../src/ol/layer/VectorTile.js';
|
import VectorTileLayer from '../../../../../src/ol/layer/VectorTile.js';
|
||||||
import {get as getProjection, fromLonLat} from '../../../../../src/ol/proj.js';
|
import {get as getProjection, fromLonLat} from '../../../../../src/ol/proj.js';
|
||||||
import Projection from '../../../../../src/ol/proj/Projection.js';
|
import Projection from '../../../../../src/ol/proj/Projection.js';
|
||||||
import _ol_render_canvas_ from '../../../../../src/ol/render/canvas.js';
|
import {checkedFonts} from '../../../../../src/ol/render/canvas.js';
|
||||||
import RenderFeature from '../../../../../src/ol/render/Feature.js';
|
import RenderFeature from '../../../../../src/ol/render/Feature.js';
|
||||||
import CanvasVectorTileLayerRenderer from '../../../../../src/ol/renderer/canvas/VectorTileLayer.js';
|
import CanvasVectorTileLayerRenderer from '../../../../../src/ol/renderer/canvas/VectorTileLayer.js';
|
||||||
import VectorTileSource from '../../../../../src/ol/source/VectorTile.js';
|
import VectorTileSource from '../../../../../src/ol/source/VectorTile.js';
|
||||||
@@ -154,7 +154,7 @@ describe('ol.renderer.canvas.VectorTileLayer', function() {
|
|||||||
|
|
||||||
it('does not re-render for unavailable fonts', function(done) {
|
it('does not re-render for unavailable fonts', function(done) {
|
||||||
map.renderSync();
|
map.renderSync();
|
||||||
clear(_ol_render_canvas_.checkedFonts_);
|
clear(checkedFonts);
|
||||||
layerStyle[0].getText().setFont('12px "Unavailable font",sans-serif');
|
layerStyle[0].getText().setFont('12px "Unavailable font",sans-serif');
|
||||||
layer.changed();
|
layer.changed();
|
||||||
const revision = layer.getRevision();
|
const revision = layer.getRevision();
|
||||||
@@ -166,7 +166,7 @@ describe('ol.renderer.canvas.VectorTileLayer', function() {
|
|||||||
|
|
||||||
it('does not re-render for available fonts', function(done) {
|
it('does not re-render for available fonts', function(done) {
|
||||||
map.renderSync();
|
map.renderSync();
|
||||||
clear(_ol_render_canvas_.checkedFonts_);
|
clear(checkedFonts);
|
||||||
layerStyle[0].getText().setFont('12px sans-serif');
|
layerStyle[0].getText().setFont('12px sans-serif');
|
||||||
layer.changed();
|
layer.changed();
|
||||||
const revision = layer.getRevision();
|
const revision = layer.getRevision();
|
||||||
@@ -178,7 +178,7 @@ describe('ol.renderer.canvas.VectorTileLayer', function() {
|
|||||||
|
|
||||||
it('re-renders for fonts that become available', function(done) {
|
it('re-renders for fonts that become available', function(done) {
|
||||||
map.renderSync();
|
map.renderSync();
|
||||||
clear(_ol_render_canvas_.checkedFonts_);
|
clear(checkedFonts);
|
||||||
head.appendChild(font);
|
head.appendChild(font);
|
||||||
layerStyle[0].getText().setFont('12px "Dancing Script",sans-serif');
|
layerStyle[0].getText().setFont('12px "Dancing Script",sans-serif');
|
||||||
layer.changed();
|
layer.changed();
|
||||||
|
|||||||
Reference in New Issue
Block a user