ig_markerfactory
Advanced tools
Comparing version 2.12.3 to 2.12.4
@@ -0,1 +1,68 @@ | ||
function hslaString(hslcolor) { | ||
if (hslcolor.a) { | ||
return ( | ||
"hsla(" + | ||
hslcolor.h + | ||
"," + | ||
hslcolor.s + | ||
"%," + | ||
hslcolor.l + | ||
"%," + | ||
hslcolor.a + | ||
")" | ||
); | ||
} | ||
return "hsl(" + hslcolor.h + "," + hslcolor.s + "%," + hslcolor.l + "%)"; | ||
} | ||
function rgbaString(hexcolor) { | ||
if (hexcolor.a) { | ||
return ( | ||
"rgba(" + | ||
hexcolor.r + | ||
"," + | ||
hexcolor.g + | ||
"," + | ||
hexcolor.b + | ||
"," + | ||
hexcolor.a + | ||
")" | ||
); | ||
} | ||
return "rgb(" + hexcolor.r + "," + hexcolor.g + "," + hexcolor.b + ")"; | ||
} | ||
function parseHalf(foo) { | ||
return parseInt(foo / 2, 10); | ||
} | ||
function compact(array) { | ||
var index = -1, | ||
length = array ? array.length : 0, | ||
resIndex = 0, | ||
result = []; | ||
while (++index < length) { | ||
var value = array[index]; | ||
if (value) { | ||
result[resIndex++] = value; | ||
} | ||
} | ||
return result; | ||
} | ||
function omit(obj, fn) { | ||
var target = {}; | ||
for (var i in obj) { | ||
if (fn(i)) { | ||
continue; | ||
} | ||
if (!Object.prototype.hasOwnProperty.call(obj, i)) { | ||
continue; | ||
} | ||
target[i] = obj[i]; | ||
} | ||
return target; | ||
} | ||
function IconObject(canvas, markerOpts) { | ||
@@ -10,10 +77,8 @@ this.url = canvas.toDataURL(); | ||
IconObject.prototype.toJSON = function() { | ||
return { | ||
url: null, | ||
markerOpts: this.markerOpts | ||
}; | ||
return omit(this.markerOpts, function(prop) { | ||
return prop.indexOf("gm_") === 0 || prop === "url"; | ||
}); | ||
}; | ||
/** global: google */ | ||
function createClusterIcon(theoptions) { | ||
@@ -136,55 +201,2 @@ var generateClusterCanvas = function(options) { | ||
function hslaString(hslcolor) { | ||
if (hslcolor.a) { | ||
return ( | ||
"hsla(" + | ||
hslcolor.h + | ||
"," + | ||
hslcolor.s + | ||
"%," + | ||
hslcolor.l + | ||
"%," + | ||
hslcolor.a + | ||
")" | ||
); | ||
} | ||
return "hsl(" + hslcolor.h + "," + hslcolor.s + "%," + hslcolor.l + "%)"; | ||
} | ||
function rgbaString(hexcolor) { | ||
if (hexcolor.a) { | ||
return ( | ||
"rgba(" + | ||
hexcolor.r + | ||
"," + | ||
hexcolor.g + | ||
"," + | ||
hexcolor.b + | ||
"," + | ||
hexcolor.a + | ||
")" | ||
); | ||
} | ||
return "rgb(" + hexcolor.r + "," + hexcolor.g + "," + hexcolor.b + ")"; | ||
} | ||
function parseHalf(foo) { | ||
return parseInt(foo / 2, 10); | ||
} | ||
function compact(array) { | ||
var index = -1, | ||
length = array ? array.length : 0, | ||
resIndex = 0, | ||
result = []; | ||
while (++index < length) { | ||
var value = array[index]; | ||
if (value) { | ||
result[resIndex++] = value; | ||
} | ||
} | ||
return result; | ||
} | ||
/** global: google, r, g, b */ | ||
@@ -464,3 +476,2 @@ | ||
/** global: google */ | ||
function createTextMarker(theoptions) { | ||
@@ -592,3 +603,2 @@ var generateCanvas = function(options) { | ||
/** global: google */ | ||
function createFatMarkerIcon(theoptions) { | ||
@@ -693,3 +703,2 @@ var generateFatCanvas = function(options) { | ||
/** global: google */ | ||
function createTransparentMarkerIcon(theoptions) { | ||
@@ -807,9 +816,13 @@ var generateTransparentCanvas = function(options) { | ||
} | ||
var sortedOpts = Object.entries(options) | ||
.filter(function(item) { | ||
return ( | ||
typeof item[1] !== "function" && typeof item[1] !== "object" | ||
); | ||
}) | ||
.sort(); | ||
var cleanOptions = omit(options, function(prop) { | ||
return prop.indexOf("gm_") === 0; | ||
}), | ||
sortedOpts = Object.entries(cleanOptions) | ||
.filter(function(item) { | ||
return ( | ||
typeof item[1] !== "function" && | ||
typeof item[1] !== "object" | ||
); | ||
}) | ||
.sort(); | ||
return JSON.stringify(sortedOpts); | ||
@@ -816,0 +829,0 @@ }, |
@@ -7,949 +7,962 @@ (function (global, factory) { | ||
function IconObject(canvas, markerOpts) { | ||
this.url = canvas.toDataURL(); | ||
this.fillColor = canvas.fillColor; | ||
this.markerOpts = markerOpts; | ||
Object.assign(this, markerOpts); | ||
return this; | ||
function hslaString(hslcolor) { | ||
if (hslcolor.a) { | ||
return ( | ||
"hsla(" + | ||
hslcolor.h + | ||
"," + | ||
hslcolor.s + | ||
"%," + | ||
hslcolor.l + | ||
"%," + | ||
hslcolor.a + | ||
")" | ||
); | ||
} | ||
return "hsl(" + hslcolor.h + "," + hslcolor.s + "%," + hslcolor.l + "%)"; | ||
} | ||
IconObject.prototype.toJSON = function() { | ||
return { | ||
url: null, | ||
markerOpts: this.markerOpts | ||
}; | ||
}; | ||
function rgbaString(hexcolor) { | ||
if (hexcolor.a) { | ||
return ( | ||
"rgba(" + | ||
hexcolor.r + | ||
"," + | ||
hexcolor.g + | ||
"," + | ||
hexcolor.b + | ||
"," + | ||
hexcolor.a + | ||
")" | ||
); | ||
} | ||
return "rgb(" + hexcolor.r + "," + hexcolor.g + "," + hexcolor.b + ")"; | ||
} | ||
/** global: google */ | ||
function parseHalf(foo) { | ||
return parseInt(foo / 2, 10); | ||
} | ||
function createClusterIcon(theoptions) { | ||
var generateClusterCanvas = function(options) { | ||
var canvas = options.canvas || document.createElement("canvas"), | ||
anchorX = 27, | ||
anchorY = 53, | ||
radius = anchorX - 9, | ||
color1, | ||
font = options.font || "fontello", | ||
fontsize = options.fontsize || 14, | ||
context = canvas.getContext("2d"); | ||
function compact(array) { | ||
var index = -1, | ||
length = array ? array.length : 0, | ||
resIndex = 0, | ||
result = []; | ||
canvas.width = anchorX * 2; | ||
canvas.height = anchorY + 1; | ||
while (++index < length) { | ||
var value = array[index]; | ||
if (value) { | ||
result[resIndex++] = value; | ||
} | ||
} | ||
return result; | ||
} | ||
context.clearRect(0, 0, canvas.width, canvas.height); | ||
context.moveTo(anchorX, anchorY); | ||
function omit(obj, fn) { | ||
var target = {}; | ||
for (var i in obj) { | ||
if (fn(i)) { | ||
continue; | ||
} | ||
if (!Object.prototype.hasOwnProperty.call(obj, i)) { | ||
continue; | ||
} | ||
target[i] = obj[i]; | ||
} | ||
return target; | ||
} | ||
var labelvalue = parseInt(options.label, 10); | ||
if (labelvalue < 10) { | ||
color1 = "orange"; | ||
fontsize = 14; | ||
} else if (labelvalue < 30) { | ||
color1 = "red"; | ||
fontsize = 15; | ||
} else { | ||
color1 = "purple"; | ||
fontsize = 16; | ||
} | ||
if (labelvalue > 99) { | ||
radius = radius + 3; | ||
context.setLineDash([5, 5]); | ||
context.beginPath(); | ||
context.arc( | ||
anchorX, | ||
2 + 0.5 * anchorY, | ||
radius + 7, | ||
0, | ||
2 * Math.PI, | ||
false | ||
); | ||
context.fillStyle = "transparent"; | ||
context.strokeStyle = color1; | ||
context.lineWidth = 2; | ||
context.fill(); | ||
context.stroke(); | ||
} | ||
function IconObject(canvas, markerOpts) { | ||
this.url = canvas.toDataURL(); | ||
this.fillColor = canvas.fillColor; | ||
this.markerOpts = markerOpts; | ||
Object.assign(this, markerOpts); | ||
return this; | ||
} | ||
context.setLineDash([5, 5]); | ||
context.beginPath(); | ||
context.arc( | ||
anchorX, | ||
2 + 0.5 * anchorY, | ||
radius + 2, | ||
0, | ||
2 * Math.PI, | ||
false | ||
); | ||
context.fillStyle = "transparent"; | ||
context.strokeStyle = color1; | ||
context.lineWidth = 2; | ||
context.fill(); | ||
context.stroke(); | ||
IconObject.prototype.toJSON = function() { | ||
return omit(this.markerOpts, function(prop) { | ||
return prop.indexOf("gm_") === 0 || prop === "url"; | ||
}); | ||
}; | ||
// Círculo blanco | ||
context.setLineDash([5, 0]); | ||
context.beginPath(); | ||
context.arc( | ||
anchorX, | ||
2 + 0.5 * anchorY, | ||
radius - 3, | ||
0, | ||
2 * Math.PI, | ||
false | ||
); | ||
context.fillStyle = "white"; | ||
context.strokeStyle = color1; | ||
context.lineWidth = 4; | ||
context.fill(); | ||
context.stroke(); | ||
/** global: google */ | ||
function createClusterIcon(theoptions) { | ||
var generateClusterCanvas = function(options) { | ||
var canvas = options.canvas || document.createElement("canvas"), | ||
anchorX = 27, | ||
anchorY = 53, | ||
radius = anchorX - 9, | ||
color1, | ||
font = options.font || "fontello", | ||
fontsize = options.fontsize || 14, | ||
context = canvas.getContext("2d"); | ||
context.beginPath(); | ||
canvas.width = anchorX * 2; | ||
canvas.height = anchorY + 1; | ||
context.font = "normal normal normal " + fontsize + "px " + font; | ||
context.fillStyle = "#333"; | ||
context.textBaseline = "top"; | ||
context.clearRect(0, 0, canvas.width, canvas.height); | ||
context.moveTo(anchorX, anchorY); | ||
var textWidth = context.measureText(options.label), | ||
text_x = options.label, | ||
label_x = Math.floor(canvas.width / 2 - textWidth.width / 2), | ||
label_y = 1 + Math.floor(canvas.height / 2 - fontsize / 2); | ||
var labelvalue = parseInt(options.label, 10); | ||
if (labelvalue < 10) { | ||
color1 = "orange"; | ||
fontsize = 14; | ||
} else if (labelvalue < 30) { | ||
color1 = "red"; | ||
fontsize = 15; | ||
} else { | ||
color1 = "purple"; | ||
fontsize = 16; | ||
} | ||
if (labelvalue > 99) { | ||
radius = radius + 3; | ||
context.setLineDash([5, 5]); | ||
context.beginPath(); | ||
context.arc( | ||
anchorX, | ||
2 + 0.5 * anchorY, | ||
radius + 7, | ||
0, | ||
2 * Math.PI, | ||
false | ||
); | ||
context.fillStyle = "transparent"; | ||
context.strokeStyle = color1; | ||
context.lineWidth = 2; | ||
context.fill(); | ||
context.stroke(); | ||
} | ||
// centre the text. | ||
context.fillText(text_x, label_x, label_y); | ||
context.setLineDash([5, 5]); | ||
context.beginPath(); | ||
context.arc( | ||
anchorX, | ||
2 + 0.5 * anchorY, | ||
radius + 2, | ||
0, | ||
2 * Math.PI, | ||
false | ||
); | ||
context.fillStyle = "transparent"; | ||
context.strokeStyle = color1; | ||
context.lineWidth = 2; | ||
context.fill(); | ||
context.stroke(); | ||
return canvas; | ||
}; | ||
theoptions.scale = theoptions.scale || 1; | ||
var markerCanvas = generateClusterCanvas(theoptions), | ||
markerOpts = {}, | ||
scale = theoptions.scale; | ||
// Círculo blanco | ||
context.setLineDash([5, 0]); | ||
context.beginPath(); | ||
context.arc( | ||
anchorX, | ||
2 + 0.5 * anchorY, | ||
radius - 3, | ||
0, | ||
2 * Math.PI, | ||
false | ||
); | ||
context.fillStyle = "white"; | ||
context.strokeStyle = color1; | ||
context.lineWidth = 4; | ||
context.fill(); | ||
context.stroke(); | ||
Object.assign(markerOpts, theoptions); | ||
context.beginPath(); | ||
if (window && window.google && window.google.maps) { | ||
Object.assign(markerOpts, { | ||
size: new google.maps.Size(54, 48), | ||
origin: new google.maps.Point(0, 0), | ||
anchor: new google.maps.Point(27 * scale, 24 * scale), | ||
scaledSize: new google.maps.Size(54 * scale, 48 * scale) | ||
}); | ||
} | ||
context.font = "normal normal normal " + fontsize + "px " + font; | ||
context.fillStyle = "#333"; | ||
context.textBaseline = "top"; | ||
var iconObj = new IconObject(markerCanvas, markerOpts); | ||
var textWidth = context.measureText(options.label), | ||
text_x = options.label, | ||
label_x = Math.floor(canvas.width / 2 - textWidth.width / 2), | ||
label_y = 1 + Math.floor(canvas.height / 2 - fontsize / 2); | ||
return iconObj; | ||
} | ||
// centre the text. | ||
context.fillText(text_x, label_x, label_y); | ||
function hslaString(hslcolor) { | ||
if (hslcolor.a) { | ||
return ( | ||
"hsla(" + | ||
hslcolor.h + | ||
"," + | ||
hslcolor.s + | ||
"%," + | ||
hslcolor.l + | ||
"%," + | ||
hslcolor.a + | ||
")" | ||
); | ||
} | ||
return "hsl(" + hslcolor.h + "," + hslcolor.s + "%," + hslcolor.l + "%)"; | ||
} | ||
return canvas; | ||
}; | ||
theoptions.scale = theoptions.scale || 1; | ||
var markerCanvas = generateClusterCanvas(theoptions), | ||
markerOpts = {}, | ||
scale = theoptions.scale; | ||
function rgbaString(hexcolor) { | ||
if (hexcolor.a) { | ||
return ( | ||
"rgba(" + | ||
hexcolor.r + | ||
"," + | ||
hexcolor.g + | ||
"," + | ||
hexcolor.b + | ||
"," + | ||
hexcolor.a + | ||
")" | ||
); | ||
} | ||
return "rgb(" + hexcolor.r + "," + hexcolor.g + "," + hexcolor.b + ")"; | ||
} | ||
Object.assign(markerOpts, theoptions); | ||
function parseHalf(foo) { | ||
return parseInt(foo / 2, 10); | ||
} | ||
if (window && window.google && window.google.maps) { | ||
Object.assign(markerOpts, { | ||
size: new google.maps.Size(54, 48), | ||
origin: new google.maps.Point(0, 0), | ||
anchor: new google.maps.Point(27 * scale, 24 * scale), | ||
scaledSize: new google.maps.Size(54 * scale, 48 * scale) | ||
}); | ||
} | ||
function compact(array) { | ||
var index = -1, | ||
length = array ? array.length : 0, | ||
resIndex = 0, | ||
result = []; | ||
var iconObj = new IconObject(markerCanvas, markerOpts); | ||
while (++index < length) { | ||
var value = array[index]; | ||
if (value) { | ||
result[resIndex++] = value; | ||
} | ||
} | ||
return result; | ||
} | ||
return iconObj; | ||
} | ||
/** global: google, r, g, b */ | ||
/** global: google, r, g, b */ | ||
function parseHex(hexstring, opacity, darkenfactor) { | ||
var hexcolor = { | ||
hex: hexstring | ||
}; | ||
darkenfactor = darkenfactor || 1; | ||
function parseHex(hexstring, opacity, darkenfactor) { | ||
var hexcolor = { | ||
hex: hexstring | ||
}; | ||
darkenfactor = darkenfactor || 1; | ||
hexstring = hexstring.replace("#", ""); | ||
if (hexstring.length === 3) { | ||
hexstring = | ||
hexstring[0] + | ||
hexstring[0] + | ||
hexstring[1] + | ||
hexstring[1] + | ||
hexstring[2] + | ||
hexstring[2]; | ||
} | ||
if (isNaN(parseFloat(opacity, 10))) { | ||
opacity = 1; | ||
} | ||
hexstring = hexstring.replace("#", ""); | ||
if (hexstring.length === 3) { | ||
hexstring = | ||
hexstring[0] + | ||
hexstring[0] + | ||
hexstring[1] + | ||
hexstring[1] + | ||
hexstring[2] + | ||
hexstring[2]; | ||
} | ||
if (isNaN(parseFloat(opacity, 10))) { | ||
opacity = 1; | ||
} | ||
hexcolor.r = parseInt( | ||
darkenfactor * parseInt(hexstring.substring(0, 2), 16), | ||
10 | ||
); | ||
hexcolor.g = parseInt( | ||
darkenfactor * parseInt(hexstring.substring(2, 4), 16), | ||
10 | ||
); | ||
hexcolor.b = parseInt( | ||
darkenfactor * parseInt(hexstring.substring(4, 6), 16), | ||
10 | ||
); | ||
hexcolor.a = opacity; | ||
hexcolor.fillColor = rgbaString(hexcolor); | ||
hexcolor.strokeColor = [ | ||
"rgba(" + parseHalf(hexcolor.r), | ||
parseHalf(hexcolor.g), | ||
parseHalf(hexcolor.b), | ||
hexcolor.a + ")" | ||
].join(","); | ||
hexcolor.rgb = hexcolor.fillColor; | ||
return hexcolor; | ||
} | ||
hexcolor.r = parseInt( | ||
darkenfactor * parseInt(hexstring.substring(0, 2), 16), | ||
10 | ||
); | ||
hexcolor.g = parseInt( | ||
darkenfactor * parseInt(hexstring.substring(2, 4), 16), | ||
10 | ||
); | ||
hexcolor.b = parseInt( | ||
darkenfactor * parseInt(hexstring.substring(4, 6), 16), | ||
10 | ||
); | ||
hexcolor.a = opacity; | ||
hexcolor.fillColor = rgbaString(hexcolor); | ||
hexcolor.strokeColor = [ | ||
"rgba(" + parseHalf(hexcolor.r), | ||
parseHalf(hexcolor.g), | ||
parseHalf(hexcolor.b), | ||
hexcolor.a + ")" | ||
].join(","); | ||
hexcolor.rgb = hexcolor.fillColor; | ||
return hexcolor; | ||
} | ||
function parseHSL(hslstring, opacity) { | ||
var hslcolor = {}, | ||
hslcolor_stroke = {}, | ||
hslparts = compact(hslstring.split(/hsla?\(|,|\)|%/)); | ||
function parseHSL(hslstring, opacity) { | ||
var hslcolor = {}, | ||
hslcolor_stroke = {}, | ||
hslparts = compact(hslstring.split(/hsla?\(|,|\)|%/)); | ||
if (hslparts[3] === undefined) { | ||
hslparts[3] = 1; | ||
} | ||
if (isNaN(parseFloat(opacity, 10))) { | ||
opacity = 1; | ||
} | ||
if (hslparts[3] === undefined) { | ||
hslparts[3] = 1; | ||
} | ||
if (isNaN(parseFloat(opacity, 10))) { | ||
opacity = 1; | ||
} | ||
hslcolor.h = hslcolor_stroke.h = parseFloat(hslparts[0], 10); | ||
hslcolor.s = hslcolor_stroke.s = parseFloat(hslparts[1], 10); | ||
hslcolor.l = parseFloat(hslparts[2], 10); | ||
hslcolor.a = hslcolor_stroke.a = parseFloat(opacity * hslparts[3], 10); | ||
hslcolor_stroke.l = parseInt(hslcolor.l / 2, 10); | ||
hslcolor.h = hslcolor_stroke.h = parseFloat(hslparts[0], 10); | ||
hslcolor.s = hslcolor_stroke.s = parseFloat(hslparts[1], 10); | ||
hslcolor.l = parseFloat(hslparts[2], 10); | ||
hslcolor.a = hslcolor_stroke.a = parseFloat(opacity * hslparts[3], 10); | ||
hslcolor_stroke.l = parseInt(hslcolor.l / 2, 10); | ||
hslcolor.fillColor = hslaString(hslcolor); | ||
hslcolor.strokeColor = hslaString(hslcolor_stroke); | ||
hslcolor.hsl = hslcolor.fillColor; | ||
return hslcolor; | ||
} | ||
hslcolor.fillColor = hslaString(hslcolor); | ||
hslcolor.strokeColor = hslaString(hslcolor_stroke); | ||
hslcolor.hsl = hslcolor.fillColor; | ||
return hslcolor; | ||
} | ||
function parseRGB(rgbstring, opacity, darkenfactor) { | ||
var rgbcolor = {}, | ||
rgbparts = compact(rgbstring.split(/rgba?\(|,|\)/)); | ||
function parseRGB(rgbstring, opacity, darkenfactor) { | ||
var rgbcolor = {}, | ||
rgbparts = compact(rgbstring.split(/rgba?\(|,|\)/)); | ||
darkenfactor = darkenfactor || 1; | ||
darkenfactor = darkenfactor || 1; | ||
if (rgbparts[3] === undefined) { | ||
rgbparts[3] = 1; | ||
} | ||
if (rgbparts[3] === undefined) { | ||
rgbparts[3] = 1; | ||
} | ||
if (isNaN(parseFloat(opacity, 10))) { | ||
opacity = 1; | ||
} | ||
if (isNaN(parseFloat(opacity, 10))) { | ||
opacity = 1; | ||
} | ||
rgbcolor.r = parseInt(darkenfactor * (parseInt(rgbparts[0], 10) % 256), 10); | ||
rgbcolor.g = parseInt(darkenfactor * (parseInt(rgbparts[1], 10) % 256), 10); | ||
rgbcolor.b = parseInt(darkenfactor * (parseInt(rgbparts[2], 10) % 256), 10); | ||
rgbcolor.a = parseFloat(opacity * rgbparts[3], 10); | ||
rgbcolor.fillColor = rgbaString(rgbcolor); | ||
rgbcolor.strokeColor = | ||
"rgba(" + | ||
rgbcolor.r / 2 + | ||
"," + | ||
rgbcolor.g / 2 + | ||
"," + | ||
rgbcolor.b / 2 + | ||
"," + | ||
rgbcolor.a + | ||
")"; | ||
rgbcolor.rgb = rgbcolor.fillColor; | ||
return rgbcolor; | ||
} | ||
rgbcolor.r = parseInt(darkenfactor * (parseInt(rgbparts[0], 10) % 256), 10); | ||
rgbcolor.g = parseInt(darkenfactor * (parseInt(rgbparts[1], 10) % 256), 10); | ||
rgbcolor.b = parseInt(darkenfactor * (parseInt(rgbparts[2], 10) % 256), 10); | ||
rgbcolor.a = parseFloat(opacity * rgbparts[3], 10); | ||
rgbcolor.fillColor = rgbaString(rgbcolor); | ||
rgbcolor.strokeColor = | ||
"rgba(" + | ||
rgbcolor.r / 2 + | ||
"," + | ||
rgbcolor.g / 2 + | ||
"," + | ||
rgbcolor.b / 2 + | ||
"," + | ||
rgbcolor.a + | ||
")"; | ||
rgbcolor.rgb = rgbcolor.fillColor; | ||
return rgbcolor; | ||
} | ||
function hue2rgb(p, q, t) { | ||
if (t < 0) { | ||
t += 1; | ||
} | ||
if (t > 1) { | ||
t -= 1; | ||
} | ||
if (t < 1 / 6) { | ||
return p + (q - p) * 6 * t; | ||
} | ||
if (t < 1 / 2) { | ||
return q; | ||
} | ||
if (t < 2 / 3) { | ||
return p + (q - p) * (2 / 3 - t) * 6; | ||
} | ||
return p; | ||
} | ||
function hue2rgb(p, q, t) { | ||
if (t < 0) { | ||
t += 1; | ||
} | ||
if (t > 1) { | ||
t -= 1; | ||
} | ||
if (t < 1 / 6) { | ||
return p + (q - p) * 6 * t; | ||
} | ||
if (t < 1 / 2) { | ||
return q; | ||
} | ||
if (t < 2 / 3) { | ||
return p + (q - p) * (2 / 3 - t) * 6; | ||
} | ||
return p; | ||
} | ||
function hslToRGB(h, s, l, a, darkenfactor) { | ||
var r, g, b; | ||
function hslToRGB(h, s, l, a, darkenfactor) { | ||
var r, g, b; | ||
darkenfactor = darkenfactor || 1; | ||
h = parseFloat(h, 10) / 360; | ||
s = parseFloat(s, 10) / 100; | ||
l = parseFloat(l, 10) / 100; | ||
if (a === undefined) { | ||
a = 1; | ||
} | ||
if (s === 0) { | ||
r = g = b = l; // achromatic | ||
} else { | ||
var q = l < 0.5 ? l * (1 + s) : l + s - l * s; | ||
var p = 2 * l - q; | ||
r = hue2rgb(p, q, h + 1 / 3); | ||
g = hue2rgb(p, q, h); | ||
b = hue2rgb(p, q, h - 1 / 3); | ||
} | ||
darkenfactor = darkenfactor || 1; | ||
h = parseFloat(h, 10) / 360; | ||
s = parseFloat(s, 10) / 100; | ||
l = parseFloat(l, 10) / 100; | ||
if (a === undefined) { | ||
a = 1; | ||
} | ||
if (s === 0) { | ||
r = g = b = l; // achromatic | ||
} else { | ||
var q = l < 0.5 ? l * (1 + s) : l + s - l * s; | ||
var p = 2 * l - q; | ||
r = hue2rgb(p, q, h + 1 / 3); | ||
g = hue2rgb(p, q, h); | ||
b = hue2rgb(p, q, h - 1 / 3); | ||
} | ||
if (a === undefined) { | ||
a = 1; | ||
} | ||
if (a === undefined) { | ||
a = 1; | ||
} | ||
var rgb = { | ||
r: Math.round(r * 255 * darkenfactor), | ||
g: Math.round(g * 255 * darkenfactor), | ||
b: Math.round(b * 255 * darkenfactor), | ||
a: parseFloat(a, 10) | ||
}; | ||
var rgb = { | ||
r: Math.round(r * 255 * darkenfactor), | ||
g: Math.round(g * 255 * darkenfactor), | ||
b: Math.round(b * 255 * darkenfactor), | ||
a: parseFloat(a, 10) | ||
}; | ||
rgb.fillColor = rgbaString(rgb); | ||
rgb.fillColor = rgbaString(rgb); | ||
return rgb; | ||
} | ||
return rgb; | ||
} | ||
function rgbToHSL(in_r, in_g, in_b, in_a) { | ||
var h, | ||
r = (in_r % 256) / 255, | ||
g = (in_g % 256) / 255, | ||
b = (in_b % 256) / 255, | ||
a = in_a === undefined ? 1 : in_a, | ||
max = Math.max(r, g, b), | ||
min = Math.min(r, g, b), | ||
sum = max + min, | ||
diff = max - min, | ||
s = sum > 1 ? diff / (2 - sum) : diff / sum; | ||
function rgbToHSL(in_r, in_g, in_b, in_a) { | ||
var h, | ||
r = (in_r % 256) / 255, | ||
g = (in_g % 256) / 255, | ||
b = (in_b % 256) / 255, | ||
a = in_a === undefined ? 1 : in_a, | ||
max = Math.max(r, g, b), | ||
min = Math.min(r, g, b), | ||
sum = max + min, | ||
diff = max - min, | ||
s = sum > 1 ? diff / (2 - sum) : diff / sum; | ||
switch (max) { | ||
case r: | ||
h = (g - b) / diff + (g < b ? 6 : 0); | ||
break; | ||
case g: | ||
h = (b - r) / diff + 2; | ||
break; | ||
case b: | ||
h = (r - g) / diff + 4; | ||
break; | ||
default: | ||
h = 0; | ||
break; | ||
} | ||
switch (max) { | ||
case r: | ||
h = (g - b) / diff + (g < b ? 6 : 0); | ||
break; | ||
case g: | ||
h = (b - r) / diff + 2; | ||
break; | ||
case b: | ||
h = (r - g) / diff + 4; | ||
break; | ||
default: | ||
h = 0; | ||
break; | ||
} | ||
h /= 6; | ||
h /= 6; | ||
if (diff === 0) { | ||
h = s = 0; // achromatic | ||
} | ||
if (diff === 0) { | ||
h = s = 0; // achromatic | ||
} | ||
var hsl = { | ||
h: Math.round(360 * h), | ||
s: Math.round(100 * s), | ||
l: Math.round(50 * sum), | ||
a: Math.round(100 * a) / 100 | ||
}; | ||
var hsl = { | ||
h: Math.round(360 * h), | ||
s: Math.round(100 * s), | ||
l: Math.round(50 * sum), | ||
a: Math.round(100 * a) / 100 | ||
}; | ||
hsl.fillColor = hslaString(hsl); | ||
hsl.fillColor = hslaString(hsl); | ||
return hsl; | ||
} | ||
return hsl; | ||
} | ||
function toDecColor(stringcolor) { | ||
var parsedcolor = {}; | ||
if (!stringcolor) { | ||
parsedcolor.fillColor = "rgba(100,250,50,0.99)"; | ||
} else if (stringcolor.indexOf("rgb") !== -1) { | ||
parsedcolor = parseRGB(stringcolor); | ||
} else if (stringcolor.indexOf("hsl") !== -1) { | ||
parsedcolor = parseHSL(stringcolor); | ||
} else { | ||
parsedcolor = parseHex(stringcolor); | ||
} | ||
function toDecColor(stringcolor) { | ||
var parsedcolor = {}; | ||
if (!stringcolor) { | ||
parsedcolor.fillColor = "rgba(100,250,50,0.99)"; | ||
} else if (stringcolor.indexOf("rgb") !== -1) { | ||
parsedcolor = parseRGB(stringcolor); | ||
} else if (stringcolor.indexOf("hsl") !== -1) { | ||
parsedcolor = parseHSL(stringcolor); | ||
} else { | ||
parsedcolor = parseHex(stringcolor); | ||
} | ||
return parsedcolor; | ||
} | ||
return parsedcolor; | ||
} | ||
function getColor(val, range) { | ||
var defaults = { | ||
h: Math.floor((360 / range) * val), | ||
s: 78, // constant saturation | ||
l: 63, // constant luminance | ||
a: 1 | ||
}; | ||
function getColor(val, range) { | ||
var defaults = { | ||
h: Math.floor((360 / range) * val), | ||
s: 78, // constant saturation | ||
l: 63, // constant luminance | ||
a: 1 | ||
}; | ||
return hslaString(defaults); | ||
} | ||
return hslaString(defaults); | ||
} | ||
function getColor1() { | ||
var defaults1 = { | ||
h: 1, | ||
s: 78, // constant saturation | ||
l: 33, // constant luminance | ||
a: 1 | ||
}; | ||
return hslaString(defaults1); | ||
} | ||
function getColor1() { | ||
var defaults1 = { | ||
h: 1, | ||
s: 78, // constant saturation | ||
l: 33, // constant luminance | ||
a: 1 | ||
}; | ||
return hslaString(defaults1); | ||
} | ||
function darken(stringcolor, factor) { | ||
var darkercolor = {}; | ||
if (!factor) { | ||
factor = 1; | ||
} | ||
if (stringcolor.fillColor.indexOf("rgb") !== -1) { | ||
darkercolor.r = factor * parseHalf(stringcolor.r); | ||
darkercolor.g = factor * parseHalf(stringcolor.g); | ||
darkercolor.b = factor * parseHalf(stringcolor.b); | ||
darkercolor.a = 0.99; | ||
darkercolor.fillColor = rgbaString(darkercolor); | ||
} else if (stringcolor.fillColor.indexOf("hsl") !== -1) { | ||
darkercolor.h = stringcolor.h; | ||
darkercolor.s = stringcolor.s; | ||
darkercolor.l = factor * stringcolor.l - 30; | ||
darkercolor.fillColor = hslaString(darkercolor); | ||
} | ||
function darken(stringcolor, factor) { | ||
var darkercolor = {}; | ||
if (!factor) { | ||
factor = 1; | ||
} | ||
if (stringcolor.fillColor.indexOf("rgb") !== -1) { | ||
darkercolor.r = factor * parseHalf(stringcolor.r); | ||
darkercolor.g = factor * parseHalf(stringcolor.g); | ||
darkercolor.b = factor * parseHalf(stringcolor.b); | ||
darkercolor.a = 0.99; | ||
darkercolor.fillColor = rgbaString(darkercolor); | ||
} else if (stringcolor.fillColor.indexOf("hsl") !== -1) { | ||
darkercolor.h = stringcolor.h; | ||
darkercolor.s = stringcolor.s; | ||
darkercolor.l = factor * stringcolor.l - 30; | ||
darkercolor.fillColor = hslaString(darkercolor); | ||
} | ||
return darkercolor; | ||
} | ||
return darkercolor; | ||
} | ||
function getColors(options) { | ||
var color0, color1; | ||
if (options.index !== undefined && options.count > 0) { | ||
color0 = getColor(options.index, options.count); | ||
color1 = getColor1(); | ||
} else { | ||
var deccolor = toDecColor(options.color); | ||
color0 = deccolor.fillColor; | ||
color1 = darken(deccolor).fillColor; | ||
} | ||
return [color0, color1]; | ||
} | ||
function getColors(options) { | ||
var color0, color1; | ||
if (options.index !== undefined && options.count > 0) { | ||
color0 = getColor(options.index, options.count); | ||
color1 = getColor1(); | ||
} else { | ||
var deccolor = toDecColor(options.color); | ||
color0 = deccolor.fillColor; | ||
color1 = darken(deccolor).fillColor; | ||
} | ||
return [color0, color1]; | ||
} | ||
/** global: google */ | ||
/** global: google */ | ||
function createTextMarker(theoptions) { | ||
var generateCanvas = function(options) { | ||
var canvas = document.createElement("canvas"); | ||
var ancho = 30, | ||
alto = 40; | ||
canvas.width = ancho + 18; | ||
canvas.height = alto; | ||
var x = canvas.width / 2, | ||
y = canvas.height - 2, | ||
radius = ancho / 2, | ||
angulo = 0.6; | ||
function createTextMarker(theoptions) { | ||
var generateCanvas = function(options) { | ||
var canvas = document.createElement("canvas"); | ||
var ancho = 30, | ||
alto = 40; | ||
canvas.width = ancho + 18; | ||
canvas.height = alto; | ||
var x = canvas.width / 2, | ||
y = canvas.height - 2, | ||
radius = ancho / 2, | ||
angulo = 0.6; | ||
var font = "'" + options.font + "'" || "Arial"; | ||
var fontsize = options.fontsize || 11; | ||
var font = "'" + options.font + "'" || "Arial"; | ||
var fontsize = options.fontsize || 11; | ||
var context = canvas.getContext("2d"); | ||
var context = canvas.getContext("2d"); | ||
context.clearRect(0, 0, canvas.width, canvas.height); | ||
context.clearRect(0, 0, canvas.width, canvas.height); | ||
var radius0 = 2 * radius, | ||
cx = x + 0.95 * radius0, | ||
cy = y + 0.45 * radius0; | ||
var radius0 = 2 * radius, | ||
cx = x + 0.95 * radius0, | ||
cy = y + 0.45 * radius0; | ||
var grad = context.createLinearGradient(0, 0, 0, canvas.height), | ||
colors = getColors(options), | ||
color0 = colors[0], | ||
color1 = colors[1]; | ||
var grad = context.createLinearGradient(0, 0, 0, canvas.height), | ||
colors = getColors(options), | ||
color0 = colors[0], | ||
color1 = colors[1]; | ||
grad.addColorStop(0, color0); | ||
grad.addColorStop(1, color1); | ||
grad.addColorStop(0, color0); | ||
grad.addColorStop(1, color1); | ||
context.fillStyle = grad; | ||
context.strokeStyle = "rgba(200,200,200,0.7)"; | ||
context.fillStyle = grad; | ||
context.strokeStyle = "rgba(200,200,200,0.7)"; | ||
context.beginPath(); | ||
context.beginPath(); | ||
//arco izquierdo | ||
context.arc( | ||
cx - 1, | ||
cy, | ||
radius0, | ||
(9 * Math.PI) / 8, | ||
(-6 * Math.PI) / 8, | ||
false | ||
); | ||
//arco izquierdo | ||
context.arc( | ||
cx - 1, | ||
cy, | ||
radius0, | ||
(9 * Math.PI) / 8, | ||
(-6 * Math.PI) / 8, | ||
false | ||
); | ||
// arco superior | ||
context.arc(x, (y - 7) / 2, radius, angulo, Math.PI - angulo, true); | ||
// arco superior | ||
context.arc(x, (y - 7) / 2, radius, angulo, Math.PI - angulo, true); | ||
//arco derecho | ||
context.arc( | ||
2 * x - cx + 1, | ||
cy, | ||
radius0, | ||
(-0.95 * Math.PI) / 3, | ||
-Math.PI / 8, | ||
false | ||
); | ||
context.fill(); | ||
context.stroke(); | ||
//arco derecho | ||
context.arc( | ||
2 * x - cx + 1, | ||
cy, | ||
radius0, | ||
(-0.95 * Math.PI) / 3, | ||
-Math.PI / 8, | ||
false | ||
); | ||
context.fill(); | ||
context.stroke(); | ||
context.beginPath(); | ||
context.arc(x, 0.4 * y, (2 * radius) / 3, 0, 2 * Math.PI, false); | ||
context.fillStyle = "white"; | ||
context.fill(); | ||
context.beginPath(); | ||
context.arc(x, 0.4 * y, (2 * radius) / 3, 0, 2 * Math.PI, false); | ||
context.fillStyle = "white"; | ||
context.fill(); | ||
context.beginPath(); | ||
context.beginPath(); | ||
// Render Label | ||
//context.font = "11pt Arial"; | ||
context.font = fontsize + "pt " + font; | ||
context.textBaseline = "top"; | ||
// Render Label | ||
//context.font = "11pt Arial"; | ||
context.font = fontsize + "pt " + font; | ||
context.textBaseline = "top"; | ||
var textWidth = context.measureText(options.label); | ||
var textWidth = context.measureText(options.label); | ||
if (textWidth.width > ancho || String(options.label).length > 3) { | ||
context.rect( | ||
x - 2 - textWidth.width / 2, | ||
y - 30, | ||
x - 2 + textWidth.width / 2, | ||
y - 23 | ||
); | ||
context.fillStyle = "#F7F0F0"; | ||
context.fill(); | ||
context.stroke(); | ||
} | ||
if (textWidth.width > ancho || String(options.label).length > 3) { | ||
context.rect( | ||
x - 2 - textWidth.width / 2, | ||
y - 30, | ||
x - 2 + textWidth.width / 2, | ||
y - 23 | ||
); | ||
context.fillStyle = "#F7F0F0"; | ||
context.fill(); | ||
context.stroke(); | ||
} | ||
context.fillStyle = "black"; | ||
context.strokeStyle = "black"; | ||
// centre the text. | ||
context.fillText( | ||
options.label, | ||
1 + Math.floor(canvas.width / 2 - textWidth.width / 2), | ||
8 | ||
); | ||
context.fillStyle = "black"; | ||
context.strokeStyle = "black"; | ||
// centre the text. | ||
context.fillText( | ||
options.label, | ||
1 + Math.floor(canvas.width / 2 - textWidth.width / 2), | ||
8 | ||
); | ||
return canvas; | ||
}; | ||
theoptions.scale = theoptions.scale || 0.75; | ||
var markerCanvas = generateCanvas(theoptions), | ||
markerOpts = {}; | ||
return canvas; | ||
}; | ||
theoptions.scale = theoptions.scale || 0.75; | ||
var markerCanvas = generateCanvas(theoptions), | ||
markerOpts = {}; | ||
theoptions.type = "textmarker"; | ||
theoptions.type = "textmarker"; | ||
Object.assign(markerOpts, theoptions); | ||
Object.assign(markerOpts, theoptions); | ||
if (window && window.google && window.google.maps) { | ||
Object.assign(markerOpts, { | ||
size: new google.maps.Size(48, 40), | ||
origin: new google.maps.Point(0, 0), | ||
anchor: new google.maps.Point( | ||
24 * theoptions.scale, | ||
40 * theoptions.scale | ||
), | ||
scaledSize: new google.maps.Size( | ||
48 * theoptions.scale, | ||
40 * theoptions.scale | ||
) | ||
}); | ||
} | ||
var iconObj = new IconObject(markerCanvas, markerOpts); | ||
if (window && window.google && window.google.maps) { | ||
Object.assign(markerOpts, { | ||
size: new google.maps.Size(48, 40), | ||
origin: new google.maps.Point(0, 0), | ||
anchor: new google.maps.Point( | ||
24 * theoptions.scale, | ||
40 * theoptions.scale | ||
), | ||
scaledSize: new google.maps.Size( | ||
48 * theoptions.scale, | ||
40 * theoptions.scale | ||
) | ||
}); | ||
} | ||
var iconObj = new IconObject(markerCanvas, markerOpts); | ||
return iconObj; | ||
} | ||
return iconObj; | ||
} | ||
/** global: google */ | ||
function createFatMarkerIcon(theoptions) { | ||
var generateFatCanvas = function(options) { | ||
var canvas = options.canvas || document.createElement("canvas"), | ||
anchorX = 27, | ||
anchorY = 53, | ||
radius = anchorX - 9, | ||
angulo = 1.1, | ||
font = options.font || "fontello", | ||
fontsize = options.fontsize || 14, | ||
context = canvas.getContext("2d"), | ||
grad = context.createLinearGradient(0, 0, 0, anchorY); | ||
/** global: google */ | ||
canvas.width = anchorX * 2; | ||
canvas.height = anchorY + 1; | ||
function createFatMarkerIcon(theoptions) { | ||
var generateFatCanvas = function(options) { | ||
var canvas = options.canvas || document.createElement("canvas"), | ||
anchorX = 27, | ||
anchorY = 53, | ||
radius = anchorX - 9, | ||
angulo = 1.1, | ||
font = options.font || "fontello", | ||
fontsize = options.fontsize || 14, | ||
context = canvas.getContext("2d"), | ||
grad = context.createLinearGradient(0, 0, 0, anchorY); | ||
var colors = getColors(options), | ||
color0 = colors[0], | ||
color1 = colors[1]; | ||
canvas.width = anchorX * 2; | ||
canvas.height = anchorY + 1; | ||
context.clearRect(0, 0, canvas.width, canvas.height); | ||
var colors = getColors(options), | ||
color0 = colors[0], | ||
color1 = colors[1]; | ||
grad.addColorStop(0, color0); | ||
grad.addColorStop(1, color1); | ||
context.clearRect(0, 0, canvas.width, canvas.height); | ||
context.fillStyle = grad; | ||
context.strokeStyle = color1; | ||
context.beginPath(); | ||
grad.addColorStop(0, color0); | ||
grad.addColorStop(1, color1); | ||
context.moveTo(anchorX, anchorY); | ||
context.fillStyle = grad; | ||
context.strokeStyle = color1; | ||
context.beginPath(); | ||
// arco superior | ||
context.arc( | ||
anchorX, | ||
2 + 0.5 * anchorY, | ||
radius, | ||
angulo, | ||
Math.PI - angulo, | ||
true | ||
); | ||
context.moveTo(anchorX, anchorY); | ||
//punta inferior | ||
context.lineTo(anchorX, anchorY); | ||
// arco superior | ||
context.arc( | ||
anchorX, | ||
2 + 0.5 * anchorY, | ||
radius, | ||
angulo, | ||
Math.PI - angulo, | ||
true | ||
); | ||
context.fill(); | ||
context.stroke(); | ||
//punta inferior | ||
context.lineTo(anchorX, anchorY); | ||
// Círculo blanco | ||
context.beginPath(); | ||
context.arc( | ||
anchorX, | ||
2 + 0.5 * anchorY, | ||
radius - 3, | ||
0, | ||
2 * Math.PI, | ||
false | ||
); | ||
context.fillStyle = "white"; | ||
context.fill(); | ||
context.fill(); | ||
context.stroke(); | ||
context.beginPath(); | ||
// Círculo blanco | ||
context.beginPath(); | ||
context.arc( | ||
anchorX, | ||
2 + 0.5 * anchorY, | ||
radius - 3, | ||
0, | ||
2 * Math.PI, | ||
false | ||
); | ||
context.fillStyle = "white"; | ||
context.fill(); | ||
context.font = "normal normal normal " + fontsize + "px " + font; | ||
//console.log('context font', context.font); | ||
context.fillStyle = color1; | ||
context.textBaseline = "top"; | ||
context.beginPath(); | ||
var textWidth = context.measureText(options.unicodelabel), | ||
text_x = options.unicodelabel, | ||
label_x = Math.floor(canvas.width / 2 - textWidth.width / 2), | ||
label_y = 1 + Math.floor(canvas.height / 2 - fontsize / 2); | ||
context.font = "normal normal normal " + fontsize + "px " + font; | ||
//console.log('context font', context.font); | ||
context.fillStyle = color1; | ||
context.textBaseline = "top"; | ||
// centre the text. | ||
context.fillText(text_x, label_x, label_y); | ||
canvas.fillColor = color0; | ||
return canvas; | ||
}; | ||
var textWidth = context.measureText(options.unicodelabel), | ||
text_x = options.unicodelabel, | ||
label_x = Math.floor(canvas.width / 2 - textWidth.width / 2), | ||
label_y = 1 + Math.floor(canvas.height / 2 - fontsize / 2); | ||
var scale = theoptions.scale || 1, | ||
markerCanvas = generateFatCanvas(theoptions), | ||
markerOpts = {}; | ||
// centre the text. | ||
context.fillText(text_x, label_x, label_y); | ||
canvas.fillColor = color0; | ||
return canvas; | ||
}; | ||
theoptions.type = "fatmarker"; | ||
var scale = theoptions.scale || 1, | ||
markerCanvas = generateFatCanvas(theoptions), | ||
markerOpts = {}; | ||
Object.assign(markerOpts, theoptions); | ||
theoptions.type = "fatmarker"; | ||
Object.assign(markerOpts, theoptions); | ||
if (window && window.google && window.google.maps) { | ||
Object.assign(markerOpts, { | ||
size: new google.maps.Size(54, 48), | ||
origin: new google.maps.Point(0, 0), | ||
anchor: new google.maps.Point(21 * scale, 36 * scale), | ||
scaledSize: new google.maps.Size(42 * scale, 36 * scale), | ||
scale: scale | ||
}); | ||
} | ||
var iconObj = new IconObject(markerCanvas, markerOpts); | ||
return iconObj; | ||
if (window && window.google && window.google.maps) { | ||
Object.assign(markerOpts, { | ||
size: new google.maps.Size(54, 48), | ||
origin: new google.maps.Point(0, 0), | ||
anchor: new google.maps.Point(21 * scale, 36 * scale), | ||
scaledSize: new google.maps.Size(42 * scale, 36 * scale), | ||
scale: scale | ||
}); | ||
} | ||
var iconObj = new IconObject(markerCanvas, markerOpts); | ||
return iconObj; | ||
} | ||
/** global: google */ | ||
/** global: google */ | ||
function createTransparentMarkerIcon(theoptions) { | ||
var generateTransparentCanvas = function(options) { | ||
var text_x, | ||
canvas = options.canvas || document.createElement("canvas"), | ||
context = canvas.getContext("2d"), | ||
font = options.font || "fontello", | ||
fontsize = options.fontsize || 26; | ||
function createTransparentMarkerIcon(theoptions) { | ||
var generateTransparentCanvas = function(options) { | ||
var text_x, | ||
canvas = options.canvas || document.createElement("canvas"), | ||
context = canvas.getContext("2d"), | ||
font = options.font || "fontello", | ||
fontsize = options.fontsize || 26; | ||
canvas.width = 54; | ||
canvas.height = 48; | ||
context.clearRect(0, 0, canvas.width, canvas.height); | ||
canvas.width = 54; | ||
canvas.height = 48; | ||
context.clearRect(0, 0, canvas.width, canvas.height); | ||
var colors = getColors(options), | ||
color0 = colors[0], | ||
color1 = colors[1]; | ||
context.beginPath(); | ||
var colors = getColors(options), | ||
color0 = colors[0], | ||
color1 = colors[1]; | ||
context.beginPath(); | ||
if (options.shadow) { | ||
context.font = "normal normal normal " + fontsize + "px " + font; | ||
if (options.shadow) { | ||
context.font = "normal normal normal " + fontsize + "px " + font; | ||
context.textBaseline = "top"; | ||
var textWidth = context.measureText(options.unicodelabel); | ||
text_x = Math.floor(canvas.width / 2 - textWidth.width / 2); | ||
context.textBaseline = "top"; | ||
var textWidth = context.measureText(options.unicodelabel); | ||
text_x = Math.floor(canvas.width / 2 - textWidth.width / 2); | ||
context.shadowOffsetX = -2; | ||
context.shadowOffsetY = -2; | ||
context.shadowBlur = 0; | ||
context.shadowOffsetX = -2; | ||
context.shadowOffsetY = -2; | ||
context.shadowBlur = 0; | ||
context.fillStyle = "#FFFFFF"; | ||
context.shadowColor = "#666666"; | ||
context.fillStyle = "#FFFFFF"; | ||
context.shadowColor = "#666666"; | ||
context.fillText(options.unicodelabel, text_x - 4, 2); | ||
context.fillText(options.unicodelabel, text_x, 5); | ||
context.fillStyle = color0; | ||
context.fillText(options.unicodelabel, text_x + 4, 8); | ||
context.fillText(options.unicodelabel, text_x - 4, 2); | ||
context.fillText(options.unicodelabel, text_x, 5); | ||
context.fillStyle = color0; | ||
context.fillText(options.unicodelabel, text_x + 4, 8); | ||
context.strokeStyle = "#FFFFFF"; | ||
context.strokeText(options.unicodelabel, text_x + 4, 8); | ||
} else { | ||
context.font = | ||
"normal normal normal " + (fontsize - 3) + "px " + font; | ||
context.strokeStyle = "#FFFFFF"; | ||
context.strokeText(options.unicodelabel, text_x + 4, 8); | ||
} else { | ||
context.font = | ||
"normal normal normal " + (fontsize - 3) + "px " + font; | ||
context.textBaseline = "top"; | ||
var textmetric = context.measureText(options.unicodelabel); | ||
text_x = Math.floor(canvas.width / 2 - textmetric.width / 2); | ||
context.textBaseline = "top"; | ||
var textmetric = context.measureText(options.unicodelabel); | ||
text_x = Math.floor(canvas.width / 2 - textmetric.width / 2); | ||
//console.debug('textmetric', textmetric); | ||
//console.debug('textmetric', textmetric); | ||
context.shadowOffsetX = 2; | ||
context.shadowOffsetY = 2; | ||
context.shadowBlur = 0; | ||
context.shadowColor = "#FFFFFF"; | ||
context.fillStyle = color0; | ||
context.fillText(options.unicodelabel, text_x + 1, 6); | ||
context.shadowOffsetX = 2; | ||
context.shadowOffsetY = 2; | ||
context.shadowBlur = 0; | ||
context.shadowColor = "#FFFFFF"; | ||
context.fillStyle = color0; | ||
context.fillText(options.unicodelabel, text_x + 1, 6); | ||
context.shadowOffsetX = 2; | ||
context.shadowOffsetY = 2; | ||
context.shadowBlur = 1; | ||
context.shadowColor = "#FFFFFF"; | ||
context.strokeStyle = color1; | ||
context.strokeText(options.unicodelabel, text_x + 1, 6); | ||
} | ||
context.shadowOffsetX = 2; | ||
context.shadowOffsetY = 2; | ||
context.shadowBlur = 1; | ||
context.shadowColor = "#FFFFFF"; | ||
context.strokeStyle = color1; | ||
context.strokeText(options.unicodelabel, text_x + 1, 6); | ||
} | ||
canvas.fillColor = color0; | ||
canvas.fillColor = color0; | ||
return canvas; | ||
}; | ||
return canvas; | ||
}; | ||
theoptions.scale = theoptions.scale || 1; | ||
theoptions.fontsize = theoptions.fontsize || 26; | ||
theoptions.scale = theoptions.scale || 1; | ||
theoptions.fontsize = theoptions.fontsize || 26; | ||
var markerCanvas = generateTransparentCanvas(theoptions), | ||
markerOpts = {}; | ||
var markerCanvas = generateTransparentCanvas(theoptions), | ||
markerOpts = {}; | ||
var scale = theoptions.scale; | ||
var scale = theoptions.scale; | ||
theoptions.type = "transparent"; | ||
theoptions.type = "transparent"; | ||
Object.assign(markerOpts, theoptions); | ||
Object.assign(markerOpts, theoptions); | ||
if (window.google && window.google.maps) { | ||
Object.assign(markerOpts, { | ||
size: new google.maps.Size(54 * scale, 48 * scale), | ||
origin: new google.maps.Point(0, 0), | ||
anchor: new google.maps.Point(27 * scale, 24 * scale), | ||
scaledSize: new google.maps.Size(54 * scale, 48 * scale) | ||
}); | ||
} | ||
var iconObj = new IconObject(markerCanvas, markerOpts); | ||
if (window.google && window.google.maps) { | ||
Object.assign(markerOpts, { | ||
size: new google.maps.Size(54 * scale, 48 * scale), | ||
origin: new google.maps.Point(0, 0), | ||
anchor: new google.maps.Point(27 * scale, 24 * scale), | ||
scaledSize: new google.maps.Size(54 * scale, 48 * scale) | ||
}); | ||
} | ||
var iconObj = new IconObject(markerCanvas, markerOpts); | ||
return iconObj; | ||
} | ||
return iconObj; | ||
} | ||
/** global: google, r, g, b */ | ||
/** global: google, r, g, b */ | ||
function padHex(str_in) { | ||
if (("" + str_in).length === 1) { | ||
return "0" + String(str_in); | ||
} else { | ||
return String(str_in); | ||
} | ||
} | ||
function padHex(str_in) { | ||
if (("" + str_in).length === 1) { | ||
return "0" + String(str_in); | ||
} else { | ||
return String(str_in); | ||
} | ||
} | ||
var MarkerFactory = { | ||
createTransparentMarkerIcon: createTransparentMarkerIcon, | ||
createFatMarkerIcon: createFatMarkerIcon, | ||
createTextMarker: createTextMarker, | ||
createClusterIcon: createClusterIcon, | ||
serializeOptions: function(options) { | ||
if (typeof options !== "object") { | ||
return null; | ||
} | ||
var cleanOptions = omit(options, function(prop) { | ||
return prop.indexOf("gm_") === 0; | ||
}), | ||
sortedOpts = Object.entries(cleanOptions) | ||
.filter(function(item) { | ||
return ( | ||
typeof item[1] !== "function" && | ||
typeof item[1] !== "object" | ||
); | ||
}) | ||
.sort(); | ||
return JSON.stringify(sortedOpts); | ||
}, | ||
generateAutoicon: function(options) { | ||
var generatorFN = MarkerFactory.createFatMarkerIcon, | ||
iconObj; | ||
options.type = "fatmarker"; | ||
var MarkerFactory = { | ||
createTransparentMarkerIcon: createTransparentMarkerIcon, | ||
createFatMarkerIcon: createFatMarkerIcon, | ||
createTextMarker: createTextMarker, | ||
createClusterIcon: createClusterIcon, | ||
serializeOptions: function(options) { | ||
if (typeof options !== "object") { | ||
return null; | ||
} | ||
var sortedOpts = Object.entries(options) | ||
.filter(function(item) { | ||
return ( | ||
typeof item[1] !== "function" && typeof item[1] !== "object" | ||
); | ||
}) | ||
.sort(); | ||
return JSON.stringify(sortedOpts); | ||
}, | ||
generateAutoicon: function(options) { | ||
var generatorFN = MarkerFactory.createFatMarkerIcon, | ||
iconObj; | ||
options.type = "fatmarker"; | ||
if (!options.is_icon) { | ||
options.type = "textmarker"; | ||
generatorFN = MarkerFactory.createTextMarker; | ||
} else if (options.transparent_background) { | ||
options.type = "transparent"; | ||
generatorFN = MarkerFactory.createTransparentMarkerIcon; | ||
} | ||
if (!options.is_icon) { | ||
options.type = "textmarker"; | ||
generatorFN = MarkerFactory.createTextMarker; | ||
} else if (options.transparent_background) { | ||
options.type = "transparent"; | ||
generatorFN = MarkerFactory.createTransparentMarkerIcon; | ||
} | ||
if (!options.no_cache) { | ||
var cacheKey = MarkerFactory.serializeOptions(options); | ||
if (!options.no_cache) { | ||
var cacheKey = MarkerFactory.serializeOptions(options); | ||
iconObj = window.sessionStorage.getItem(cacheKey); | ||
if (iconObj !== null && !options.no_cache) { | ||
return JSON.parse(iconObj); | ||
} | ||
} | ||
iconObj = window.sessionStorage.getItem(cacheKey); | ||
if (iconObj !== null && !options.no_cache) { | ||
return JSON.parse(iconObj); | ||
} | ||
} | ||
iconObj = generatorFN(options); | ||
iconObj = generatorFN(options); | ||
if (!options.no_cache) { | ||
var cached = iconObj.toJSON(); | ||
cached.url = iconObj.url; | ||
window.sessionStorage.setItem(cacheKey, JSON.stringify(cached)); | ||
} | ||
return iconObj; | ||
}, | ||
/** | ||
* Receives a color string rgb(a), hsl(a) or hex, returns its components | ||
* in rgba and hsla, with optional transparency | ||
* plus a darkened version (default is half of each RGB component) and a | ||
* | ||
* @param {string} somecolor - A color string in rgb(a), hsl(a) or hex format | ||
* @param {Number} opacity - Opacity to apply to the color. Optional, default 1 | ||
* @param {Number} darkenfactor - How much darker should the resulting color be. Optional, default 1 | ||
* | ||
* @return {Object} input color parsed and modified as requested | ||
*/ | ||
parseColorString: function(somecolor, opacity, darkenfactor) { | ||
var parsedcolor = { | ||
original: somecolor | ||
}, | ||
hsl, | ||
rgb; | ||
if (!options.no_cache) { | ||
var cached = iconObj.toJSON(); | ||
cached.url = iconObj.url; | ||
window.sessionStorage.setItem(cacheKey, JSON.stringify(cached)); | ||
} | ||
return iconObj; | ||
}, | ||
/** | ||
* Receives a color string rgb(a), hsl(a) or hex, returns its components | ||
* in rgba and hsla, with optional transparency | ||
* plus a darkened version (default is half of each RGB component) and a | ||
* | ||
* @param {string} somecolor - A color string in rgb(a), hsl(a) or hex format | ||
* @param {Number} opacity - Opacity to apply to the color. Optional, default 1 | ||
* @param {Number} darkenfactor - How much darker should the resulting color be. Optional, default 1 | ||
* | ||
* @return {Object} input color parsed and modified as requested | ||
*/ | ||
parseColorString: function(somecolor, opacity, darkenfactor) { | ||
var parsedcolor = { | ||
original: somecolor | ||
}, | ||
hsl, | ||
rgb; | ||
darkenfactor = darkenfactor || 1; | ||
opacity = opacity || 1; | ||
darkenfactor = darkenfactor || 1; | ||
opacity = opacity || 1; | ||
if (somecolor.indexOf("hsl") !== -1) { | ||
hsl = parseHSL(somecolor, opacity); | ||
rgb = hslToRGB(hsl.h, hsl.s, hsl.l, hsl.a, darkenfactor); | ||
} else if (somecolor.indexOf("rgb") !== -1) { | ||
rgb = parseRGB(somecolor, opacity, darkenfactor); | ||
} else { | ||
rgb = parseHex(somecolor, opacity, darkenfactor); | ||
} | ||
if (somecolor.indexOf("hsl") !== -1) { | ||
hsl = parseHSL(somecolor, opacity); | ||
rgb = hslToRGB(hsl.h, hsl.s, hsl.l, hsl.a, darkenfactor); | ||
} else if (somecolor.indexOf("rgb") !== -1) { | ||
rgb = parseRGB(somecolor, opacity, darkenfactor); | ||
} else { | ||
rgb = parseHex(somecolor, opacity, darkenfactor); | ||
} | ||
hsl = rgbToHSL(rgb.r, rgb.g, rgb.b, rgb.a); | ||
hsl = rgbToHSL(rgb.r, rgb.g, rgb.b, rgb.a); | ||
parsedcolor.hsl = { | ||
h: hsl.h, | ||
s: hsl.s, | ||
l: hsl.l, | ||
a: hsl.a | ||
}; | ||
parsedcolor.rgb = { | ||
r: rgb.r, | ||
g: rgb.g, | ||
b: rgb.b, | ||
a: rgb.a | ||
}; | ||
parsedcolor.hsl = { | ||
h: hsl.h, | ||
s: hsl.s, | ||
l: hsl.l, | ||
a: hsl.a | ||
}; | ||
parsedcolor.rgb = { | ||
r: rgb.r, | ||
g: rgb.g, | ||
b: rgb.b, | ||
a: rgb.a | ||
}; | ||
parsedcolor.fillColor = rgb.fillColor; | ||
parsedcolor.rgba = rgb.fillColor; | ||
parsedcolor.hsla = hsl.fillColor; | ||
parsedcolor.strokeColor = rgb.strokeColor; | ||
parsedcolor.hex = [ | ||
"#", | ||
padHex(rgb.r.toString(16)), | ||
padHex(rgb.g.toString(16)), | ||
padHex(rgb.b.toString(16)) | ||
].join(""); | ||
return parsedcolor; | ||
}, | ||
parsedcolor.fillColor = rgb.fillColor; | ||
parsedcolor.rgba = rgb.fillColor; | ||
parsedcolor.hsla = hsl.fillColor; | ||
parsedcolor.strokeColor = rgb.strokeColor; | ||
parsedcolor.hex = [ | ||
"#", | ||
padHex(rgb.r.toString(16)), | ||
padHex(rgb.g.toString(16)), | ||
padHex(rgb.b.toString(16)) | ||
].join(""); | ||
return parsedcolor; | ||
}, | ||
/** | ||
* Generates an google maps marker (or an image as dataurl from the given options) | ||
* | ||
* @param {Object} options The options | ||
* @return {Object} { description_of_the_return_value } | ||
*/ | ||
autoIcon: function(options) { | ||
if (typeof options !== "object") { | ||
console.warn("autoIcon expects an object as its only parameter"); | ||
return null; | ||
} | ||
// unless explicitly set to false, the icon doesn't have a marker-like wrapper | ||
options.transparent_background = | ||
options.transparent_background !== false; | ||
/** | ||
* Generates an google maps marker (or an image as dataurl from the given options) | ||
* | ||
* @param {Object} options The options | ||
* @return {Object} { description_of_the_return_value } | ||
*/ | ||
autoIcon: function(options) { | ||
if (typeof options !== "object") { | ||
console.warn("autoIcon expects an object as its only parameter"); | ||
return null; | ||
} | ||
// unless explicitly set to false, the icon doesn't have a marker-like wrapper | ||
options.transparent_background = | ||
options.transparent_background !== false; | ||
options.label = String(options.label || "A"); | ||
options.color = options.color || "#FF0000"; | ||
options.label = String(options.label || "A"); | ||
options.color = options.color || "#FF0000"; | ||
if ( | ||
options.label.length === 4 || | ||
options.label.substring(0, 2) === "0x" | ||
) { | ||
options.font = options.font || "fontello"; | ||
options.label = (options.label || "e836").slice(-4); | ||
options.unicodelabel = String.fromCharCode("0x" + options.label); | ||
options.scale = options.scale || 1; | ||
options.is_icon = true; | ||
if ( | ||
options.label.length === 4 || | ||
options.label.substring(0, 2) === "0x" | ||
) { | ||
options.font = options.font || "fontello"; | ||
options.label = (options.label || "e836").slice(-4); | ||
options.unicodelabel = String.fromCharCode("0x" + options.label); | ||
options.scale = options.scale || 1; | ||
options.is_icon = true; | ||
return MarkerFactory.generateAutoicon(options); | ||
} else if (options.shadow) { | ||
return MarkerFactory.generateAutoicon(options); | ||
} else if (options.shadow) { | ||
return MarkerFactory.createClusterIcon(options); | ||
} else { | ||
options.scale = options.scale || 0.75; | ||
options.label = String(options.label || "A"); | ||
options.fontsize = options.fontsize || 11; | ||
options.font = options.font || "Arial"; | ||
// This is text I should print literally | ||
return MarkerFactory.createClusterIcon(options); | ||
} else { | ||
options.scale = options.scale || 0.75; | ||
options.label = String(options.label || "A"); | ||
options.fontsize = options.fontsize || 11; | ||
options.font = options.font || "Arial"; | ||
// This is text I should print literally | ||
return MarkerFactory.generateAutoicon(options); | ||
} | ||
} | ||
}; | ||
return MarkerFactory.generateAutoicon(options); | ||
} | ||
} | ||
}; | ||
exports.MarkerFactory = MarkerFactory; | ||
exports.MarkerFactory = MarkerFactory; | ||
Object.defineProperty(exports, '__esModule', { value: true }); | ||
Object.defineProperty(exports, '__esModule', { value: true }); | ||
}))); |
@@ -1,2 +0,2 @@ | ||
!function(global,factory){"object"==typeof exports&&"undefined"!=typeof module?factory(exports):"function"==typeof define&&define.amd?define(["exports"],factory):factory(global=global||{})}(this,function(exports){"use strict";function IconObject(canvas,markerOpts){return this.url=canvas.toDataURL(),this.fillColor=canvas.fillColor,this.markerOpts=markerOpts,Object.assign(this,markerOpts),this}function hslaString(hslcolor){return hslcolor.a?"hsla("+hslcolor.h+","+hslcolor.s+"%,"+hslcolor.l+"%,"+hslcolor.a+")":"hsl("+hslcolor.h+","+hslcolor.s+"%,"+hslcolor.l+"%)"}function rgbaString(hexcolor){return hexcolor.a?"rgba("+hexcolor.r+","+hexcolor.g+","+hexcolor.b+","+hexcolor.a+")":"rgb("+hexcolor.r+","+hexcolor.g+","+hexcolor.b+")"}function parseHalf(foo){return parseInt(foo/2,10)}function compact(array){for(var index=-1,length=array?array.length:0,resIndex=0,result=[];++index<length;){var value=array[index];value&&(result[resIndex++]=value)}return result}function parseHex(hexstring,opacity,darkenfactor){var hexcolor={hex:hexstring};return darkenfactor=darkenfactor||1,3===(hexstring=hexstring.replace("#","")).length&&(hexstring=hexstring[0]+hexstring[0]+hexstring[1]+hexstring[1]+hexstring[2]+hexstring[2]),isNaN(parseFloat(opacity,10))&&(opacity=1),hexcolor.r=parseInt(darkenfactor*parseInt(hexstring.substring(0,2),16),10),hexcolor.g=parseInt(darkenfactor*parseInt(hexstring.substring(2,4),16),10),hexcolor.b=parseInt(darkenfactor*parseInt(hexstring.substring(4,6),16),10),hexcolor.a=opacity,hexcolor.fillColor=rgbaString(hexcolor),hexcolor.strokeColor=["rgba("+parseHalf(hexcolor.r),parseHalf(hexcolor.g),parseHalf(hexcolor.b),hexcolor.a+")"].join(","),hexcolor.rgb=hexcolor.fillColor,hexcolor}function parseHSL(hslstring,opacity){var hslcolor={},hslcolor_stroke={},hslparts=compact(hslstring.split(/hsla?\(|,|\)|%/));return void 0===hslparts[3]&&(hslparts[3]=1),isNaN(parseFloat(opacity,10))&&(opacity=1),hslcolor.h=hslcolor_stroke.h=parseFloat(hslparts[0],10),hslcolor.s=hslcolor_stroke.s=parseFloat(hslparts[1],10),hslcolor.l=parseFloat(hslparts[2],10),hslcolor.a=hslcolor_stroke.a=parseFloat(opacity*hslparts[3],10),hslcolor_stroke.l=parseInt(hslcolor.l/2,10),hslcolor.fillColor=hslaString(hslcolor),hslcolor.strokeColor=hslaString(hslcolor_stroke),hslcolor.hsl=hslcolor.fillColor,hslcolor}function parseRGB(rgbstring,opacity,darkenfactor){var rgbcolor={},rgbparts=compact(rgbstring.split(/rgba?\(|,|\)/));return darkenfactor=darkenfactor||1,void 0===rgbparts[3]&&(rgbparts[3]=1),isNaN(parseFloat(opacity,10))&&(opacity=1),rgbcolor.r=parseInt(darkenfactor*(parseInt(rgbparts[0],10)%256),10),rgbcolor.g=parseInt(darkenfactor*(parseInt(rgbparts[1],10)%256),10),rgbcolor.b=parseInt(darkenfactor*(parseInt(rgbparts[2],10)%256),10),rgbcolor.a=parseFloat(opacity*rgbparts[3],10),rgbcolor.fillColor=rgbaString(rgbcolor),rgbcolor.strokeColor="rgba("+rgbcolor.r/2+","+rgbcolor.g/2+","+rgbcolor.b/2+","+rgbcolor.a+")",rgbcolor.rgb=rgbcolor.fillColor,rgbcolor}function hue2rgb(p,q,t){return t<0&&(t+=1),t>1&&(t-=1),t<1/6?p+6*(q-p)*t:t<.5?q:t<2/3?p+(q-p)*(2/3-t)*6:p}function getColors(options){var color0,color1;if(void 0!==options.index&&options.count>0)color0=function(val,range){return hslaString({h:Math.floor(360/range*val),s:78,l:63,a:1})}(options.index,options.count),color1=hslaString({h:1,s:78,l:33,a:1});else{var deccolor=function(stringcolor){var parsedcolor={};return stringcolor?parsedcolor=-1!==stringcolor.indexOf("rgb")?parseRGB(stringcolor):-1!==stringcolor.indexOf("hsl")?parseHSL(stringcolor):parseHex(stringcolor):parsedcolor.fillColor="rgba(100,250,50,0.99)",parsedcolor}(options.color);color0=deccolor.fillColor,color1=function(stringcolor,factor){var darkercolor={};return factor||(factor=1),-1!==stringcolor.fillColor.indexOf("rgb")?(darkercolor.r=factor*parseHalf(stringcolor.r),darkercolor.g=factor*parseHalf(stringcolor.g),darkercolor.b=factor*parseHalf(stringcolor.b),darkercolor.a=.99,darkercolor.fillColor=rgbaString(darkercolor)):-1!==stringcolor.fillColor.indexOf("hsl")&&(darkercolor.h=stringcolor.h,darkercolor.s=stringcolor.s,darkercolor.l=factor*stringcolor.l-30,darkercolor.fillColor=hslaString(darkercolor)),darkercolor}(deccolor).fillColor}return[color0,color1]}function padHex(str_in){return 1===(""+str_in).length?"0"+String(str_in):String(str_in)}IconObject.prototype.toJSON=function(){return{url:null,markerOpts:this.markerOpts}};var MarkerFactory={createTransparentMarkerIcon:function(theoptions){theoptions.scale=theoptions.scale||1,theoptions.fontsize=theoptions.fontsize||26;var markerCanvas=function(options){var text_x,canvas=options.canvas||document.createElement("canvas"),context=canvas.getContext("2d"),font=options.font||"fontello",fontsize=options.fontsize||26;canvas.width=54,canvas.height=48,context.clearRect(0,0,canvas.width,canvas.height);var colors=getColors(options),color0=colors[0],color1=colors[1];if(context.beginPath(),options.shadow){context.font="normal normal normal "+fontsize+"px "+font,context.textBaseline="top";var textWidth=context.measureText(options.unicodelabel);text_x=Math.floor(canvas.width/2-textWidth.width/2),context.shadowOffsetX=-2,context.shadowOffsetY=-2,context.shadowBlur=0,context.fillStyle="#FFFFFF",context.shadowColor="#666666",context.fillText(options.unicodelabel,text_x-4,2),context.fillText(options.unicodelabel,text_x,5),context.fillStyle=color0,context.fillText(options.unicodelabel,text_x+4,8),context.strokeStyle="#FFFFFF",context.strokeText(options.unicodelabel,text_x+4,8)}else{context.font="normal normal normal "+(fontsize-3)+"px "+font,context.textBaseline="top";var textmetric=context.measureText(options.unicodelabel);text_x=Math.floor(canvas.width/2-textmetric.width/2),context.shadowOffsetX=2,context.shadowOffsetY=2,context.shadowBlur=0,context.shadowColor="#FFFFFF",context.fillStyle=color0,context.fillText(options.unicodelabel,text_x+1,6),context.shadowOffsetX=2,context.shadowOffsetY=2,context.shadowBlur=1,context.shadowColor="#FFFFFF",context.strokeStyle=color1,context.strokeText(options.unicodelabel,text_x+1,6)}return canvas.fillColor=color0,canvas}(theoptions),markerOpts={},scale=theoptions.scale;return theoptions.type="transparent",Object.assign(markerOpts,theoptions),window.google&&window.google.maps&&Object.assign(markerOpts,{size:new google.maps.Size(54*scale,48*scale),origin:new google.maps.Point(0,0),anchor:new google.maps.Point(27*scale,24*scale),scaledSize:new google.maps.Size(54*scale,48*scale)}),new IconObject(markerCanvas,markerOpts)},createFatMarkerIcon:function(theoptions){var scale=theoptions.scale||1,markerCanvas=function(options){var canvas=options.canvas||document.createElement("canvas"),font=options.font||"fontello",fontsize=options.fontsize||14,context=canvas.getContext("2d"),grad=context.createLinearGradient(0,0,0,53);canvas.width=54,canvas.height=54;var colors=getColors(options),color0=colors[0],color1=colors[1];context.clearRect(0,0,canvas.width,canvas.height),grad.addColorStop(0,color0),grad.addColorStop(1,color1),context.fillStyle=grad,context.strokeStyle=color1,context.beginPath(),context.moveTo(27,53),context.arc(27,28.5,18,1.1,Math.PI-1.1,!0),context.lineTo(27,53),context.fill(),context.stroke(),context.beginPath(),context.arc(27,28.5,15,0,2*Math.PI,!1),context.fillStyle="white",context.fill(),context.beginPath(),context.font="normal normal normal "+fontsize+"px "+font,context.fillStyle=color1,context.textBaseline="top";var textWidth=context.measureText(options.unicodelabel),text_x=options.unicodelabel,label_x=Math.floor(canvas.width/2-textWidth.width/2),label_y=1+Math.floor(canvas.height/2-fontsize/2);return context.fillText(text_x,label_x,label_y),canvas.fillColor=color0,canvas}(theoptions),markerOpts={};return theoptions.type="fatmarker",Object.assign(markerOpts,theoptions),window&&window.google&&window.google.maps&&Object.assign(markerOpts,{size:new google.maps.Size(54,48),origin:new google.maps.Point(0,0),anchor:new google.maps.Point(21*scale,36*scale),scaledSize:new google.maps.Size(42*scale,36*scale),scale:scale}),new IconObject(markerCanvas,markerOpts)},createTextMarker:function(theoptions){theoptions.scale=theoptions.scale||.75;var markerCanvas=function(options){var canvas=document.createElement("canvas");canvas.width=48,canvas.height=40;var x=canvas.width/2,y=canvas.height-2,font="'"+options.font+"'"||"Arial",fontsize=options.fontsize||11,context=canvas.getContext("2d");context.clearRect(0,0,canvas.width,canvas.height);var cx=x+28.5,cy=y+13.5,grad=context.createLinearGradient(0,0,0,canvas.height),colors=getColors(options),color0=colors[0],color1=colors[1];grad.addColorStop(0,color0),grad.addColorStop(1,color1),context.fillStyle=grad,context.strokeStyle="rgba(200,200,200,0.7)",context.beginPath(),context.arc(cx-1,cy,30,9*Math.PI/8,-6*Math.PI/8,!1),context.arc(x,(y-7)/2,15,.6,Math.PI-.6,!0),context.arc(2*x-cx+1,cy,30,-.95*Math.PI/3,-Math.PI/8,!1),context.fill(),context.stroke(),context.beginPath(),context.arc(x,.4*y,10,0,2*Math.PI,!1),context.fillStyle="white",context.fill(),context.beginPath(),context.font=fontsize+"pt "+font,context.textBaseline="top";var textWidth=context.measureText(options.label);return(textWidth.width>30||String(options.label).length>3)&&(context.rect(x-2-textWidth.width/2,y-30,x-2+textWidth.width/2,y-23),context.fillStyle="#F7F0F0",context.fill(),context.stroke()),context.fillStyle="black",context.strokeStyle="black",context.fillText(options.label,1+Math.floor(canvas.width/2-textWidth.width/2),8),canvas}(theoptions),markerOpts={};return theoptions.type="textmarker",Object.assign(markerOpts,theoptions),window&&window.google&&window.google.maps&&Object.assign(markerOpts,{size:new google.maps.Size(48,40),origin:new google.maps.Point(0,0),anchor:new google.maps.Point(24*theoptions.scale,40*theoptions.scale),scaledSize:new google.maps.Size(48*theoptions.scale,40*theoptions.scale)}),new IconObject(markerCanvas,markerOpts)},createClusterIcon:function(theoptions){theoptions.scale=theoptions.scale||1;var markerCanvas=function(options){var color1,canvas=options.canvas||document.createElement("canvas"),radius=18,font=options.font||"fontello",fontsize=options.fontsize||14,context=canvas.getContext("2d");canvas.width=54,canvas.height=54,context.clearRect(0,0,canvas.width,canvas.height),context.moveTo(27,53);var labelvalue=parseInt(options.label,10);labelvalue<10?(color1="orange",fontsize=14):labelvalue<30?(color1="red",fontsize=15):(color1="purple",fontsize=16),labelvalue>99&&(radius+=3,context.setLineDash([5,5]),context.beginPath(),context.arc(27,28.5,radius+7,0,2*Math.PI,!1),context.fillStyle="transparent",context.strokeStyle=color1,context.lineWidth=2,context.fill(),context.stroke()),context.setLineDash([5,5]),context.beginPath(),context.arc(27,28.5,radius+2,0,2*Math.PI,!1),context.fillStyle="transparent",context.strokeStyle=color1,context.lineWidth=2,context.fill(),context.stroke(),context.setLineDash([5,0]),context.beginPath(),context.arc(27,28.5,radius-3,0,2*Math.PI,!1),context.fillStyle="white",context.strokeStyle=color1,context.lineWidth=4,context.fill(),context.stroke(),context.beginPath(),context.font="normal normal normal "+fontsize+"px "+font,context.fillStyle="#333",context.textBaseline="top";var textWidth=context.measureText(options.label),text_x=options.label,label_x=Math.floor(canvas.width/2-textWidth.width/2),label_y=1+Math.floor(canvas.height/2-fontsize/2);return context.fillText(text_x,label_x,label_y),canvas}(theoptions),markerOpts={},scale=theoptions.scale;return Object.assign(markerOpts,theoptions),window&&window.google&&window.google.maps&&Object.assign(markerOpts,{size:new google.maps.Size(54,48),origin:new google.maps.Point(0,0),anchor:new google.maps.Point(27*scale,24*scale),scaledSize:new google.maps.Size(54*scale,48*scale)}),new IconObject(markerCanvas,markerOpts)},serializeOptions:function(options){if("object"!=typeof options)return null;var sortedOpts=Object.entries(options).filter(function(item){return"function"!=typeof item[1]&&"object"!=typeof item[1]}).sort();return JSON.stringify(sortedOpts)},generateAutoicon:function(options){var iconObj,generatorFN=MarkerFactory.createFatMarkerIcon;if(options.type="fatmarker",options.is_icon?options.transparent_background&&(options.type="transparent",generatorFN=MarkerFactory.createTransparentMarkerIcon):(options.type="textmarker",generatorFN=MarkerFactory.createTextMarker),!options.no_cache){var cacheKey=MarkerFactory.serializeOptions(options);if(null!==(iconObj=window.sessionStorage.getItem(cacheKey))&&!options.no_cache)return JSON.parse(iconObj)}if(iconObj=generatorFN(options),!options.no_cache){var cached=iconObj.toJSON();cached.url=iconObj.url,window.sessionStorage.setItem(cacheKey,JSON.stringify(cached))}return iconObj},parseColorString:function(somecolor,opacity,darkenfactor){var hsl,rgb,parsedcolor={original:somecolor};return darkenfactor=darkenfactor||1,opacity=opacity||1,rgb=-1!==somecolor.indexOf("hsl")?function(h,s,l,a,darkenfactor){var r,g,b;if(darkenfactor=darkenfactor||1,h=parseFloat(h,10)/360,s=parseFloat(s,10)/100,l=parseFloat(l,10)/100,void 0===a&&(a=1),0===s)r=g=b=l;else{var q=l<.5?l*(1+s):l+s-l*s,p=2*l-q;r=hue2rgb(p,q,h+1/3),g=hue2rgb(p,q,h),b=hue2rgb(p,q,h-1/3)}void 0===a&&(a=1);var rgb={r:Math.round(255*r*darkenfactor),g:Math.round(255*g*darkenfactor),b:Math.round(255*b*darkenfactor),a:parseFloat(a,10)};return rgb.fillColor=rgbaString(rgb),rgb}((hsl=parseHSL(somecolor,opacity)).h,hsl.s,hsl.l,hsl.a,darkenfactor):-1!==somecolor.indexOf("rgb")?parseRGB(somecolor,opacity,darkenfactor):parseHex(somecolor,opacity,darkenfactor),hsl=function(in_r,in_g,in_b,in_a){var h,r=in_r%256/255,g=in_g%256/255,b=in_b%256/255,a=void 0===in_a?1:in_a,max=Math.max(r,g,b),min=Math.min(r,g,b),sum=max+min,diff=max-min,s=sum>1?diff/(2-sum):diff/sum;switch(max){case r:h=(g-b)/diff+(g<b?6:0);break;case g:h=(b-r)/diff+2;break;case b:h=(r-g)/diff+4;break;default:h=0}h/=6,0===diff&&(h=s=0);var hsl={h:Math.round(360*h),s:Math.round(100*s),l:Math.round(50*sum),a:Math.round(100*a)/100};return hsl.fillColor=hslaString(hsl),hsl}(rgb.r,rgb.g,rgb.b,rgb.a),parsedcolor.hsl={h:hsl.h,s:hsl.s,l:hsl.l,a:hsl.a},parsedcolor.rgb={r:rgb.r,g:rgb.g,b:rgb.b,a:rgb.a},parsedcolor.fillColor=rgb.fillColor,parsedcolor.rgba=rgb.fillColor,parsedcolor.hsla=hsl.fillColor,parsedcolor.strokeColor=rgb.strokeColor,parsedcolor.hex=["#",padHex(rgb.r.toString(16)),padHex(rgb.g.toString(16)),padHex(rgb.b.toString(16))].join(""),parsedcolor},autoIcon:function(options){return"object"!=typeof options?(console.warn("autoIcon expects an object as its only parameter"),null):(options.transparent_background=!1!==options.transparent_background,options.label=String(options.label||"A"),options.color=options.color||"#FF0000",4===options.label.length||"0x"===options.label.substring(0,2)?(options.font=options.font||"fontello",options.label=(options.label||"e836").slice(-4),options.unicodelabel=String.fromCharCode("0x"+options.label),options.scale=options.scale||1,options.is_icon=!0,MarkerFactory.generateAutoicon(options)):options.shadow?MarkerFactory.createClusterIcon(options):(options.scale=options.scale||.75,options.label=String(options.label||"A"),options.fontsize=options.fontsize||11,options.font=options.font||"Arial",MarkerFactory.generateAutoicon(options)))}};exports.MarkerFactory=MarkerFactory,Object.defineProperty(exports,"__esModule",{value:!0})}); | ||
!function(global,factory){"object"==typeof exports&&"undefined"!=typeof module?factory(exports):"function"==typeof define&&define.amd?define(["exports"],factory):factory(global=global||{})}(this,function(exports){"use strict";function hslaString(hslcolor){return hslcolor.a?"hsla("+hslcolor.h+","+hslcolor.s+"%,"+hslcolor.l+"%,"+hslcolor.a+")":"hsl("+hslcolor.h+","+hslcolor.s+"%,"+hslcolor.l+"%)"}function rgbaString(hexcolor){return hexcolor.a?"rgba("+hexcolor.r+","+hexcolor.g+","+hexcolor.b+","+hexcolor.a+")":"rgb("+hexcolor.r+","+hexcolor.g+","+hexcolor.b+")"}function parseHalf(foo){return parseInt(foo/2,10)}function compact(array){for(var index=-1,length=array?array.length:0,resIndex=0,result=[];++index<length;){var value=array[index];value&&(result[resIndex++]=value)}return result}function omit(obj,fn){var target={};for(var i in obj)fn(i)||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}function IconObject(canvas,markerOpts){return this.url=canvas.toDataURL(),this.fillColor=canvas.fillColor,this.markerOpts=markerOpts,Object.assign(this,markerOpts),this}function parseHex(hexstring,opacity,darkenfactor){var hexcolor={hex:hexstring};return darkenfactor=darkenfactor||1,3===(hexstring=hexstring.replace("#","")).length&&(hexstring=hexstring[0]+hexstring[0]+hexstring[1]+hexstring[1]+hexstring[2]+hexstring[2]),isNaN(parseFloat(opacity,10))&&(opacity=1),hexcolor.r=parseInt(darkenfactor*parseInt(hexstring.substring(0,2),16),10),hexcolor.g=parseInt(darkenfactor*parseInt(hexstring.substring(2,4),16),10),hexcolor.b=parseInt(darkenfactor*parseInt(hexstring.substring(4,6),16),10),hexcolor.a=opacity,hexcolor.fillColor=rgbaString(hexcolor),hexcolor.strokeColor=["rgba("+parseHalf(hexcolor.r),parseHalf(hexcolor.g),parseHalf(hexcolor.b),hexcolor.a+")"].join(","),hexcolor.rgb=hexcolor.fillColor,hexcolor}function parseHSL(hslstring,opacity){var hslcolor={},hslcolor_stroke={},hslparts=compact(hslstring.split(/hsla?\(|,|\)|%/));return void 0===hslparts[3]&&(hslparts[3]=1),isNaN(parseFloat(opacity,10))&&(opacity=1),hslcolor.h=hslcolor_stroke.h=parseFloat(hslparts[0],10),hslcolor.s=hslcolor_stroke.s=parseFloat(hslparts[1],10),hslcolor.l=parseFloat(hslparts[2],10),hslcolor.a=hslcolor_stroke.a=parseFloat(opacity*hslparts[3],10),hslcolor_stroke.l=parseInt(hslcolor.l/2,10),hslcolor.fillColor=hslaString(hslcolor),hslcolor.strokeColor=hslaString(hslcolor_stroke),hslcolor.hsl=hslcolor.fillColor,hslcolor}function parseRGB(rgbstring,opacity,darkenfactor){var rgbcolor={},rgbparts=compact(rgbstring.split(/rgba?\(|,|\)/));return darkenfactor=darkenfactor||1,void 0===rgbparts[3]&&(rgbparts[3]=1),isNaN(parseFloat(opacity,10))&&(opacity=1),rgbcolor.r=parseInt(darkenfactor*(parseInt(rgbparts[0],10)%256),10),rgbcolor.g=parseInt(darkenfactor*(parseInt(rgbparts[1],10)%256),10),rgbcolor.b=parseInt(darkenfactor*(parseInt(rgbparts[2],10)%256),10),rgbcolor.a=parseFloat(opacity*rgbparts[3],10),rgbcolor.fillColor=rgbaString(rgbcolor),rgbcolor.strokeColor="rgba("+rgbcolor.r/2+","+rgbcolor.g/2+","+rgbcolor.b/2+","+rgbcolor.a+")",rgbcolor.rgb=rgbcolor.fillColor,rgbcolor}function hue2rgb(p,q,t){return t<0&&(t+=1),t>1&&(t-=1),t<1/6?p+6*(q-p)*t:t<.5?q:t<2/3?p+(q-p)*(2/3-t)*6:p}function getColors(options){var color0,color1;if(void 0!==options.index&&options.count>0)color0=function(val,range){return hslaString({h:Math.floor(360/range*val),s:78,l:63,a:1})}(options.index,options.count),color1=hslaString({h:1,s:78,l:33,a:1});else{var deccolor=function(stringcolor){var parsedcolor={};return stringcolor?parsedcolor=-1!==stringcolor.indexOf("rgb")?parseRGB(stringcolor):-1!==stringcolor.indexOf("hsl")?parseHSL(stringcolor):parseHex(stringcolor):parsedcolor.fillColor="rgba(100,250,50,0.99)",parsedcolor}(options.color);color0=deccolor.fillColor,color1=function(stringcolor,factor){var darkercolor={};return factor||(factor=1),-1!==stringcolor.fillColor.indexOf("rgb")?(darkercolor.r=factor*parseHalf(stringcolor.r),darkercolor.g=factor*parseHalf(stringcolor.g),darkercolor.b=factor*parseHalf(stringcolor.b),darkercolor.a=.99,darkercolor.fillColor=rgbaString(darkercolor)):-1!==stringcolor.fillColor.indexOf("hsl")&&(darkercolor.h=stringcolor.h,darkercolor.s=stringcolor.s,darkercolor.l=factor*stringcolor.l-30,darkercolor.fillColor=hslaString(darkercolor)),darkercolor}(deccolor).fillColor}return[color0,color1]}function padHex(str_in){return 1===(""+str_in).length?"0"+String(str_in):String(str_in)}IconObject.prototype.toJSON=function(){return omit(this.markerOpts,function(prop){return 0===prop.indexOf("gm_")||"url"===prop})};var MarkerFactory={createTransparentMarkerIcon:function(theoptions){theoptions.scale=theoptions.scale||1,theoptions.fontsize=theoptions.fontsize||26;var markerCanvas=function(options){var text_x,canvas=options.canvas||document.createElement("canvas"),context=canvas.getContext("2d"),font=options.font||"fontello",fontsize=options.fontsize||26;canvas.width=54,canvas.height=48,context.clearRect(0,0,canvas.width,canvas.height);var colors=getColors(options),color0=colors[0],color1=colors[1];if(context.beginPath(),options.shadow){context.font="normal normal normal "+fontsize+"px "+font,context.textBaseline="top";var textWidth=context.measureText(options.unicodelabel);text_x=Math.floor(canvas.width/2-textWidth.width/2),context.shadowOffsetX=-2,context.shadowOffsetY=-2,context.shadowBlur=0,context.fillStyle="#FFFFFF",context.shadowColor="#666666",context.fillText(options.unicodelabel,text_x-4,2),context.fillText(options.unicodelabel,text_x,5),context.fillStyle=color0,context.fillText(options.unicodelabel,text_x+4,8),context.strokeStyle="#FFFFFF",context.strokeText(options.unicodelabel,text_x+4,8)}else{context.font="normal normal normal "+(fontsize-3)+"px "+font,context.textBaseline="top";var textmetric=context.measureText(options.unicodelabel);text_x=Math.floor(canvas.width/2-textmetric.width/2),context.shadowOffsetX=2,context.shadowOffsetY=2,context.shadowBlur=0,context.shadowColor="#FFFFFF",context.fillStyle=color0,context.fillText(options.unicodelabel,text_x+1,6),context.shadowOffsetX=2,context.shadowOffsetY=2,context.shadowBlur=1,context.shadowColor="#FFFFFF",context.strokeStyle=color1,context.strokeText(options.unicodelabel,text_x+1,6)}return canvas.fillColor=color0,canvas}(theoptions),markerOpts={},scale=theoptions.scale;return theoptions.type="transparent",Object.assign(markerOpts,theoptions),window.google&&window.google.maps&&Object.assign(markerOpts,{size:new google.maps.Size(54*scale,48*scale),origin:new google.maps.Point(0,0),anchor:new google.maps.Point(27*scale,24*scale),scaledSize:new google.maps.Size(54*scale,48*scale)}),new IconObject(markerCanvas,markerOpts)},createFatMarkerIcon:function(theoptions){var scale=theoptions.scale||1,markerCanvas=function(options){var canvas=options.canvas||document.createElement("canvas"),font=options.font||"fontello",fontsize=options.fontsize||14,context=canvas.getContext("2d"),grad=context.createLinearGradient(0,0,0,53);canvas.width=54,canvas.height=54;var colors=getColors(options),color0=colors[0],color1=colors[1];context.clearRect(0,0,canvas.width,canvas.height),grad.addColorStop(0,color0),grad.addColorStop(1,color1),context.fillStyle=grad,context.strokeStyle=color1,context.beginPath(),context.moveTo(27,53),context.arc(27,28.5,18,1.1,Math.PI-1.1,!0),context.lineTo(27,53),context.fill(),context.stroke(),context.beginPath(),context.arc(27,28.5,15,0,2*Math.PI,!1),context.fillStyle="white",context.fill(),context.beginPath(),context.font="normal normal normal "+fontsize+"px "+font,context.fillStyle=color1,context.textBaseline="top";var textWidth=context.measureText(options.unicodelabel),text_x=options.unicodelabel,label_x=Math.floor(canvas.width/2-textWidth.width/2),label_y=1+Math.floor(canvas.height/2-fontsize/2);return context.fillText(text_x,label_x,label_y),canvas.fillColor=color0,canvas}(theoptions),markerOpts={};return theoptions.type="fatmarker",Object.assign(markerOpts,theoptions),window&&window.google&&window.google.maps&&Object.assign(markerOpts,{size:new google.maps.Size(54,48),origin:new google.maps.Point(0,0),anchor:new google.maps.Point(21*scale,36*scale),scaledSize:new google.maps.Size(42*scale,36*scale),scale:scale}),new IconObject(markerCanvas,markerOpts)},createTextMarker:function(theoptions){theoptions.scale=theoptions.scale||.75;var markerCanvas=function(options){var canvas=document.createElement("canvas");canvas.width=48,canvas.height=40;var x=canvas.width/2,y=canvas.height-2,font="'"+options.font+"'"||"Arial",fontsize=options.fontsize||11,context=canvas.getContext("2d");context.clearRect(0,0,canvas.width,canvas.height);var cx=x+28.5,cy=y+13.5,grad=context.createLinearGradient(0,0,0,canvas.height),colors=getColors(options),color0=colors[0],color1=colors[1];grad.addColorStop(0,color0),grad.addColorStop(1,color1),context.fillStyle=grad,context.strokeStyle="rgba(200,200,200,0.7)",context.beginPath(),context.arc(cx-1,cy,30,9*Math.PI/8,-6*Math.PI/8,!1),context.arc(x,(y-7)/2,15,.6,Math.PI-.6,!0),context.arc(2*x-cx+1,cy,30,-.95*Math.PI/3,-Math.PI/8,!1),context.fill(),context.stroke(),context.beginPath(),context.arc(x,.4*y,10,0,2*Math.PI,!1),context.fillStyle="white",context.fill(),context.beginPath(),context.font=fontsize+"pt "+font,context.textBaseline="top";var textWidth=context.measureText(options.label);return(textWidth.width>30||String(options.label).length>3)&&(context.rect(x-2-textWidth.width/2,y-30,x-2+textWidth.width/2,y-23),context.fillStyle="#F7F0F0",context.fill(),context.stroke()),context.fillStyle="black",context.strokeStyle="black",context.fillText(options.label,1+Math.floor(canvas.width/2-textWidth.width/2),8),canvas}(theoptions),markerOpts={};return theoptions.type="textmarker",Object.assign(markerOpts,theoptions),window&&window.google&&window.google.maps&&Object.assign(markerOpts,{size:new google.maps.Size(48,40),origin:new google.maps.Point(0,0),anchor:new google.maps.Point(24*theoptions.scale,40*theoptions.scale),scaledSize:new google.maps.Size(48*theoptions.scale,40*theoptions.scale)}),new IconObject(markerCanvas,markerOpts)},createClusterIcon:function(theoptions){theoptions.scale=theoptions.scale||1;var markerCanvas=function(options){var color1,canvas=options.canvas||document.createElement("canvas"),radius=18,font=options.font||"fontello",fontsize=options.fontsize||14,context=canvas.getContext("2d");canvas.width=54,canvas.height=54,context.clearRect(0,0,canvas.width,canvas.height),context.moveTo(27,53);var labelvalue=parseInt(options.label,10);labelvalue<10?(color1="orange",fontsize=14):labelvalue<30?(color1="red",fontsize=15):(color1="purple",fontsize=16),labelvalue>99&&(radius+=3,context.setLineDash([5,5]),context.beginPath(),context.arc(27,28.5,radius+7,0,2*Math.PI,!1),context.fillStyle="transparent",context.strokeStyle=color1,context.lineWidth=2,context.fill(),context.stroke()),context.setLineDash([5,5]),context.beginPath(),context.arc(27,28.5,radius+2,0,2*Math.PI,!1),context.fillStyle="transparent",context.strokeStyle=color1,context.lineWidth=2,context.fill(),context.stroke(),context.setLineDash([5,0]),context.beginPath(),context.arc(27,28.5,radius-3,0,2*Math.PI,!1),context.fillStyle="white",context.strokeStyle=color1,context.lineWidth=4,context.fill(),context.stroke(),context.beginPath(),context.font="normal normal normal "+fontsize+"px "+font,context.fillStyle="#333",context.textBaseline="top";var textWidth=context.measureText(options.label),text_x=options.label,label_x=Math.floor(canvas.width/2-textWidth.width/2),label_y=1+Math.floor(canvas.height/2-fontsize/2);return context.fillText(text_x,label_x,label_y),canvas}(theoptions),markerOpts={},scale=theoptions.scale;return Object.assign(markerOpts,theoptions),window&&window.google&&window.google.maps&&Object.assign(markerOpts,{size:new google.maps.Size(54,48),origin:new google.maps.Point(0,0),anchor:new google.maps.Point(27*scale,24*scale),scaledSize:new google.maps.Size(54*scale,48*scale)}),new IconObject(markerCanvas,markerOpts)},serializeOptions:function(options){if("object"!=typeof options)return null;var cleanOptions=omit(options,function(prop){return 0===prop.indexOf("gm_")}),sortedOpts=Object.entries(cleanOptions).filter(function(item){return"function"!=typeof item[1]&&"object"!=typeof item[1]}).sort();return JSON.stringify(sortedOpts)},generateAutoicon:function(options){var iconObj,generatorFN=MarkerFactory.createFatMarkerIcon;if(options.type="fatmarker",options.is_icon?options.transparent_background&&(options.type="transparent",generatorFN=MarkerFactory.createTransparentMarkerIcon):(options.type="textmarker",generatorFN=MarkerFactory.createTextMarker),!options.no_cache){var cacheKey=MarkerFactory.serializeOptions(options);if(null!==(iconObj=window.sessionStorage.getItem(cacheKey))&&!options.no_cache)return JSON.parse(iconObj)}if(iconObj=generatorFN(options),!options.no_cache){var cached=iconObj.toJSON();cached.url=iconObj.url,window.sessionStorage.setItem(cacheKey,JSON.stringify(cached))}return iconObj},parseColorString:function(somecolor,opacity,darkenfactor){var hsl,rgb,parsedcolor={original:somecolor};return darkenfactor=darkenfactor||1,opacity=opacity||1,rgb=-1!==somecolor.indexOf("hsl")?function(h,s,l,a,darkenfactor){var r,g,b;if(darkenfactor=darkenfactor||1,h=parseFloat(h,10)/360,s=parseFloat(s,10)/100,l=parseFloat(l,10)/100,void 0===a&&(a=1),0===s)r=g=b=l;else{var q=l<.5?l*(1+s):l+s-l*s,p=2*l-q;r=hue2rgb(p,q,h+1/3),g=hue2rgb(p,q,h),b=hue2rgb(p,q,h-1/3)}void 0===a&&(a=1);var rgb={r:Math.round(255*r*darkenfactor),g:Math.round(255*g*darkenfactor),b:Math.round(255*b*darkenfactor),a:parseFloat(a,10)};return rgb.fillColor=rgbaString(rgb),rgb}((hsl=parseHSL(somecolor,opacity)).h,hsl.s,hsl.l,hsl.a,darkenfactor):-1!==somecolor.indexOf("rgb")?parseRGB(somecolor,opacity,darkenfactor):parseHex(somecolor,opacity,darkenfactor),hsl=function(in_r,in_g,in_b,in_a){var h,r=in_r%256/255,g=in_g%256/255,b=in_b%256/255,a=void 0===in_a?1:in_a,max=Math.max(r,g,b),min=Math.min(r,g,b),sum=max+min,diff=max-min,s=sum>1?diff/(2-sum):diff/sum;switch(max){case r:h=(g-b)/diff+(g<b?6:0);break;case g:h=(b-r)/diff+2;break;case b:h=(r-g)/diff+4;break;default:h=0}h/=6,0===diff&&(h=s=0);var hsl={h:Math.round(360*h),s:Math.round(100*s),l:Math.round(50*sum),a:Math.round(100*a)/100};return hsl.fillColor=hslaString(hsl),hsl}(rgb.r,rgb.g,rgb.b,rgb.a),parsedcolor.hsl={h:hsl.h,s:hsl.s,l:hsl.l,a:hsl.a},parsedcolor.rgb={r:rgb.r,g:rgb.g,b:rgb.b,a:rgb.a},parsedcolor.fillColor=rgb.fillColor,parsedcolor.rgba=rgb.fillColor,parsedcolor.hsla=hsl.fillColor,parsedcolor.strokeColor=rgb.strokeColor,parsedcolor.hex=["#",padHex(rgb.r.toString(16)),padHex(rgb.g.toString(16)),padHex(rgb.b.toString(16))].join(""),parsedcolor},autoIcon:function(options){return"object"!=typeof options?(console.warn("autoIcon expects an object as its only parameter"),null):(options.transparent_background=!1!==options.transparent_background,options.label=String(options.label||"A"),options.color=options.color||"#FF0000",4===options.label.length||"0x"===options.label.substring(0,2)?(options.font=options.font||"fontello",options.label=(options.label||"e836").slice(-4),options.unicodelabel=String.fromCharCode("0x"+options.label),options.scale=options.scale||1,options.is_icon=!0,MarkerFactory.generateAutoicon(options)):options.shadow?MarkerFactory.createClusterIcon(options):(options.scale=options.scale||.75,options.label=String(options.label||"A"),options.fontsize=options.fontsize||11,options.font=options.font||"Arial",MarkerFactory.generateAutoicon(options)))}};exports.MarkerFactory=MarkerFactory,Object.defineProperty(exports,"__esModule",{value:!0})}); | ||
//# sourceMappingURL=markerfactory.min.js.map |
{ | ||
"name": "ig_markerfactory", | ||
"version": "2.12.3", | ||
"version": "2.12.4", | ||
"description": "Uses canvas to generate google.maps.Marker Icons from graphic fonts (i.e. font-awesome) on the fly", | ||
@@ -5,0 +5,0 @@ "keywords": [ |
@@ -5,29 +5,31 @@ # IG MarkerFactory | ||
[![Travis Build Status](https://img.shields.io/travis/HuasoFoundries/ig_markerfactory.svg?logo=travis)](https://travis-ci.org/HuasoFoundries/ig_markerfactory) | ||
[![Code Climate](https://codeclimate.com/github/HuasoFoundries/ig_markerfactory/badges/gpa.svg)](https://codeclimate.com/github/HuasoFoundries/ig_markerfactory) | ||
[![Codacy Badge](https://api.codacy.com/project/badge/grade/44d15485b93e43cf86356e56a8bfb7d1)](https://www.codacy.com/app/amenadiel/ig_markerfactory) | ||
[![npm](https://img.shields.io/npm/dm/ig_markerfactory.svg?logo=npm)](https://www.npmjs.com/package/ig_markerfactory) | ||
[![Scrutinizer Build](https://img.shields.io/scrutinizer/build/g/HuasoFoundries/ig_markerfactory.svg?logo=scrutinizer)](https://scrutinizer-ci.com/g/HuasoFoundries/ig_markerfactory/?branch=master) | ||
[![Scrutinizer Code Quality](https://img.shields.io/scrutinizer/g/HuasoFoundries/ig_markerfactory.svg?logo=scrutinizer)](https://scrutinizer-ci.com/g/HuasoFoundries/ig_markerfactory/?branch=master) | ||
[![Build Status](https://travis-ci.org/HuasoFoundries/ig_markerfactory.svg)](https://travis-ci.org/HuasoFoundries/ig_markerfactory) [![Code Climate](https://codeclimate.com/github/HuasoFoundries/ig_markerfactory/badges/gpa.svg)](https://codeclimate.com/github/HuasoFoundries/ig_markerfactory) [![Codacy Badge](https://api.codacy.com/project/badge/grade/44d15485b93e43cf86356e56a8bfb7d1)](https://www.codacy.com/app/amenadiel/ig_markerfactory) [![npm](https://img.shields.io/npm/dm/ig_markerfactory.svg?style=plastic)](https://www.npmjs.com/package/ig_markerfactory) [![Build Status](https://scrutinizer-ci.com/g/HuasoFoundries/ig_markerfactory/badges/build.png?b=master)](https://scrutinizer-ci.com/g/HuasoFoundries/ig_markerfactory/build-status/master) [![Scrutinizer Code Quality](https://scrutinizer-ci.com/g/HuasoFoundries/ig_markerfactory/badges/quality-score.png?b=master)](https://scrutinizer-ci.com/g/HuasoFoundries/ig_markerfactory/?branch=master) | ||
## Why? | ||
## Why? | ||
Because some libraries, like google maps API, expect its Markers to have an valid [google.maps.Icon](https://developers.google.com/maps/documentation/javascript/3.exp/reference#Icon) to be shown on the map: | ||
```js | ||
var mymarker = new google.maps.Marker({ | ||
position: myMap.getCenter(), | ||
map: myMap | ||
}); | ||
var mymarker = new google.maps.Marker({ | ||
position: myMap.getCenter(), | ||
map: myMap | ||
}); | ||
mymarker.setIcon({ | ||
url: '/img/some_image.png', | ||
size: new google.maps.Size(54 , 48 ), | ||
origin: new google.maps.Point(0, 0), | ||
anchor: new google.maps.Point(27 , 24 ) | ||
}); | ||
mymarker.setIcon({ | ||
url: "/img/some_image.png", | ||
size: new google.maps.Size(54, 48), | ||
origin: new google.maps.Point(0, 0), | ||
anchor: new google.maps.Point(27, 24) | ||
}); | ||
``` | ||
(Actually, it would be enough to set) | ||
(Actually, it would be enough to set) | ||
```js | ||
mymarker.setIcon('/img/some_image.png'); | ||
mymarker.setIcon("/img/some_image.png"); | ||
``` | ||
@@ -42,3 +44,3 @@ | ||
See the example running at [http://huasofoundries.github.io/ig_markerfactory/](http://huasofoundries.github.io/ig_markerfactory/) | ||
and you'll be presented with three graphical fonts variations, both in their CSS render as well as their PNG rendering generated by IG_Markerfactory. | ||
and you'll be presented with three graphical fonts variations, both in their CSS render as well as their PNG rendering generated by IG_Markerfactory. | ||
@@ -49,5 +51,2 @@ ![screenshot from 2016-07-06 12-00-51](https://cloud.githubusercontent.com/assets/238439/16625228/7ac42b58-4371-11e6-9b44-6bdde4098958.png) | ||
## Installation | ||
@@ -57,3 +56,3 @@ | ||
Include this package in your HTML file directly with a script tag using [unpkg](https://unpkg.com/#/) or [jsdelivr](https://www.jsdelivr.com/) | ||
Include this package in your HTML file directly with a script tag using [unpkg](https://unpkg.com/#/) or [jsdelivr](https://www.jsdelivr.com/) | ||
@@ -64,6 +63,4 @@ ```html | ||
**or** | ||
```html | ||
@@ -73,3 +70,2 @@ <script src="https://cdn.jsdelivr.net/npm/ig_markerfactory/dist/markerfactory.min.js"></script> | ||
### Install with npm | ||
@@ -83,4 +79,2 @@ | ||
### Install with [JSPM](https://github.com/jspm/jspm-cli) | ||
@@ -94,9 +88,5 @@ | ||
## Usage | ||
This is a simple example using AMD loading. It assumes you're using a font that's already present in the DOM. | ||
This is a simple example using AMD loading. It assumes you're using a font that's already present in the DOM. | ||
@@ -106,7 +96,7 @@ ### AMD Style | ||
```js | ||
define(['ig_markerfactory'], function(MarkerFactory) { | ||
define(["ig_markerfactory"], function(MarkerFactory) { | ||
var myIcon = MarkerFactory.autoIcon({ | ||
label: 'f1b9', | ||
font: 'FontAwesome', | ||
color: '#CC0000', | ||
label: "f1b9", | ||
font: "FontAwesome", | ||
color: "#CC0000", | ||
fontsize: 20 | ||
@@ -116,5 +106,3 @@ }); | ||
console.log(myIcon); | ||
}); | ||
``` | ||
@@ -127,15 +115,13 @@ | ||
```js | ||
var MarkerFactory = require('ig_markerfactory'); | ||
var MarkerFactory = require("ig_markerfactory"); | ||
var myIcon = MarkerFactory.autoIcon({ | ||
label: 'f1b9', | ||
font: 'FontAwesome', | ||
color: '#CC0000', | ||
fontsize: 20 | ||
}); | ||
label: "f1b9", | ||
font: "FontAwesome", | ||
color: "#CC0000", | ||
fontsize: 20 | ||
}); | ||
console.log(myIcon); | ||
``` | ||
### ES6 Style | ||
@@ -145,12 +131,11 @@ | ||
```js | ||
import {MarkerFactory} from 'ig_markerfactory/dist/markerfactory.es6'; | ||
import { MarkerFactory } from "ig_markerfactory/dist/markerfactory.es6"; | ||
const myIcon = MarkerFactory.autoIcon({ | ||
label: 'f1b9', | ||
font: 'FontAwesome', | ||
color: '#CC0000', | ||
fontsize: 20 | ||
}); | ||
label: "f1b9", | ||
font: "FontAwesome", | ||
color: "#CC0000", | ||
fontsize: 20 | ||
}); | ||
@@ -160,11 +145,3 @@ console.log(myIcon); | ||
You will see that `myIcon` object is a valid [google.maps.Icon](https://developers.google.com/maps/documentation/javascript/3.exp/reference#Icon) object, | ||
but of course you might want the image for other purposes so you can just use `myIcon.url` which is a [data URI](https://developer.mozilla.org/en-US/docs/Web/HTTP/data_URIs) | ||
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
121652
1701
135