v1.6.12 - change ocean pattern to image
BIN
images/kiwiroo.png
Normal file
|
After Width: | Height: | Size: 62 KiB |
BIN
images/pattern1.png
Normal file
|
After Width: | Height: | Size: 6.4 KiB |
BIN
images/pattern2.png
Normal file
|
After Width: | Height: | Size: 7.8 KiB |
BIN
images/pattern3.jpg
Normal file
|
After Width: | Height: | Size: 5.6 KiB |
BIN
images/pattern4.jpg
Normal file
|
After Width: | Height: | Size: 9.7 KiB |
BIN
images/pattern5.jpg
Normal file
|
After Width: | Height: | Size: 9.4 KiB |
BIN
images/pattern6.jpg
Normal file
|
After Width: | Height: | Size: 8.9 KiB |
46
index.html
|
|
@ -131,11 +131,11 @@ async function getMapURL(type, subtype) {
|
||||||
cloneDefs.querySelector("#defs-emblems")?.remove();
|
cloneDefs.querySelector("#defs-emblems")?.remove();
|
||||||
}
|
}
|
||||||
|
|
||||||
// add ocean pattern
|
// replace ocean pattern href to base64
|
||||||
if (cloneEl.getElementById("oceanicPattern")) {
|
if (cloneEl.getElementById("oceanicPattern")) {
|
||||||
const patternId = cloneEl.getElementById("oceanicPattern").getAttribute("filter").slice(5,-1);
|
const el = cloneEl.getElementById("oceanicPattern");
|
||||||
const pattern = svgDefs.getElementById(patternId);
|
const url = el.getAttribute("href");
|
||||||
if (patternId) cloneDefs.appendChild(pattern.cloneNode(true));
|
getBase64(url, base64 => el.setAttribute("href", base64));
|
||||||
}
|
}
|
||||||
|
|
||||||
// add relief icons
|
// add relief icons
|
||||||
|
|
@ -958,7 +958,7 @@ function parseLoadedData(data) {
|
||||||
if (version < 1.11) {
|
if (version < 1.11) {
|
||||||
// v 1.11 added new attributes
|
// v 1.11 added new attributes
|
||||||
terrs.attr("scheme", "bright").attr("terracing", 0).attr("skip", 5).attr("relax", 0).attr("curve", 0);
|
terrs.attr("scheme", "bright").attr("terracing", 0).attr("skip", 5).attr("relax", 0).attr("curve", 0);
|
||||||
svg.select("#oceanic > rect").attr("id", "oceanicPattern");
|
svg.select("#oceanic > *").attr("id", "oceanicPattern");
|
||||||
oceanLayers.attr("layers", "-6,-3,-1");
|
oceanLayers.attr("layers", "-6,-3,-1");
|
||||||
gridOverlay.attr("type", "pointyHex").attr("size", 10);
|
gridOverlay.attr("type", "pointyHex").attr("size", 10);
|
||||||
|
|
||||||
|
|
@ -1172,6 +1172,10 @@ function parseLoadedData(data) {
|
||||||
turnButtonOn("toggleRulers");
|
turnButtonOn("toggleRulers");
|
||||||
rulers.draw();
|
rulers.draw();
|
||||||
} else turnButtonOff("toggleRulers");
|
} else turnButtonOff("toggleRulers");
|
||||||
|
|
||||||
|
// 1.61 changed oceanicPattern from rect to image
|
||||||
|
const pattern = document.getElementById("oceanic");
|
||||||
|
pattern.innerHTML = '<image id="oceanicPattern" href="./images/pattern1.png" width="100" height="100" opacity=".2"></image>';
|
||||||
}
|
}
|
||||||
}()
|
}()
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1111,10 +1111,10 @@ function toggleTexture(event) {
|
||||||
// append default texture image selected by default. Don't append on load to not harm performance
|
// append default texture image selected by default. Don't append on load to not harm performance
|
||||||
if (!texture.selectAll("*").size()) {
|
if (!texture.selectAll("*").size()) {
|
||||||
const x = +styleTextureShiftX.value, y = +styleTextureShiftY.value;
|
const x = +styleTextureShiftX.value, y = +styleTextureShiftY.value;
|
||||||
const href = styleTextureInput.value === "default" ? getDefaultTexture() : setBase64Texture(styleTextureInput.value);
|
const image = texture.append("image").attr("id", "textureImage")
|
||||||
texture.append("image").attr("id", "textureImage")
|
|
||||||
.attr("x", x).attr("y", y).attr("width", graphWidth - x).attr("height", graphHeight - y)
|
.attr("x", x).attr("y", y).attr("width", graphWidth - x).attr("height", graphHeight - y)
|
||||||
.attr("xlink:href", href).attr("preserveAspectRatio", "xMidYMid slice");
|
.attr("xlink:href", getDefaultTexture()).attr("preserveAspectRatio", "xMidYMid slice");
|
||||||
|
if (styleTextureInput.value !== "default") getBase64(styleTextureInput.value, base64 => image.attr("xlink:href", base64));
|
||||||
}
|
}
|
||||||
$('#texture').fadeIn();
|
$('#texture').fadeIn();
|
||||||
zoom.scaleBy(svg, 1.00001); // enforce browser re-draw
|
zoom.scaleBy(svg, 1.00001); // enforce browser re-draw
|
||||||
|
|
|
||||||