How to center rect box with an svg - html
I am trying to center this wrench svg inside the rect box but I am having no luck, any thoughts. Basically Id like to center the wrench icon in the rect box.
<svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<rect width="32" height="32" rx="4" />
<path d="M15.0799 1.85914C14.4167 1.71925 13.7291 1.70835 13.0553 1.83113C12.0053 2.02243 11.0387 2.52916 10.284 3.28379C9.5294 4.03842 9.02267 5.00511 8.83137 6.05503C8.64007 7.10495 8.77329 8.18824 9.21327 9.16053C9.34197 9.44494 9.28105 9.77933 9.06031 10.0001L2.15031 16.9101C1.89313 17.1672 1.74866 17.516 1.74866 17.8797C1.74866 18.2434 1.89314 18.5922 2.15031 18.8494C2.40748 19.1066 2.75628 19.2511 3.11998 19.2511C3.48367 19.2511 3.83247 19.1066 4.08965 18.8494L10.9996 11.9394C11.2204 11.7187 11.5548 11.6577 11.8392 11.7864C12.8115 12.2264 13.8948 12.3596 14.9447 12.1683C15.9946 11.977 16.9613 11.4703 17.7159 10.7157C18.4706 9.96106 18.9773 8.99437 19.1686 7.94444C19.2914 7.27058 19.2805 6.58298 19.1406 5.9198L16.225 8.83537C15.8979 9.15602 15.458 9.33559 15 9.33559C14.5419 9.33559 14.1021 9.15599 13.775 8.83534L13.7696 8.83009L12.1643 7.22476C11.8437 6.89764 11.6641 6.45781 11.6641 5.99974C11.6641 5.54167 11.8437 5.10186 12.1644 4.77474L12.1696 4.76938L15.0799 1.85914ZM12.7864 0.355426C14.1363 0.109471 15.5291 0.280751 16.7792 0.846441C17.0035 0.947945 17.1637 1.15308 17.2078 1.3953C17.252 1.63752 17.1744 1.88597 17.0003 2.06007L13.2339 5.82652C13.1891 5.87306 13.1641 5.93513 13.1641 5.99974C13.1641 6.06434 13.1891 6.1264 13.2338 6.17294L14.8268 7.76588C14.8733 7.81059 14.9354 7.83559 15 7.83559C15.0646 7.83559 15.1266 7.81059 15.1732 7.76589L18.9396 3.99941C19.1137 3.82531 19.3622 3.74775 19.6044 3.79188C19.8466 3.83602 20.0518 3.99622 20.1533 4.22053C20.719 5.47062 20.8902 6.86342 20.6443 8.21332C20.3983 9.56322 19.7468 10.8061 18.7766 11.7763C17.8063 12.7466 16.5635 13.3981 15.2136 13.644C14.037 13.8584 12.8278 13.7558 11.709 13.3514L5.15031 19.9101C4.61183 20.4485 3.8815 20.7511 3.11998 20.7511C2.35846 20.7511 1.62812 20.4485 1.08965 19.9101C0.55117 19.3716 0.248657 18.6413 0.248657 17.8797C0.248657 17.1182 0.551171 16.3879 1.08965 15.8494L7.64833 9.29073C7.24389 8.17188 7.14129 6.96272 7.35567 5.78615C7.60162 4.43625 8.25313 3.19337 9.22337 2.22313C10.1936 1.25289 11.4365 0.601381 12.7864 0.355426Z" fill="#A0AEC0"/>
</svg>
One way is to use transform on the path:
<svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<rect width="32" height="32" rx="4" />
<path transform="translate(5, 5)" d="M15.0799 1.85914C14.4167 1.71925 13.7291 1.70835 13.0553 1.83113C12.0053 2.02243 11.0387 2.52916 10.284 3.28379C9.5294 4.03842 9.02267 5.00511 8.83137 6.05503C8.64007 7.10495 8.77329 8.18824 9.21327 9.16053C9.34197 9.44494 9.28105 9.77933 9.06031 10.0001L2.15031 16.9101C1.89313 17.1672 1.74866 17.516 1.74866 17.8797C1.74866 18.2434 1.89314 18.5922 2.15031 18.8494C2.40748 19.1066 2.75628 19.2511 3.11998 19.2511C3.48367 19.2511 3.83247 19.1066 4.08965 18.8494L10.9996 11.9394C11.2204 11.7187 11.5548 11.6577 11.8392 11.7864C12.8115 12.2264 13.8948 12.3596 14.9447 12.1683C15.9946 11.977 16.9613 11.4703 17.7159 10.7157C18.4706 9.96106 18.9773 8.99437 19.1686 7.94444C19.2914 7.27058 19.2805 6.58298 19.1406 5.9198L16.225 8.83537C15.8979 9.15602 15.458 9.33559 15 9.33559C14.5419 9.33559 14.1021 9.15599 13.775 8.83534L13.7696 8.83009L12.1643 7.22476C11.8437 6.89764 11.6641 6.45781 11.6641 5.99974C11.6641 5.54167 11.8437 5.10186 12.1644 4.77474L12.1696 4.76938L15.0799 1.85914ZM12.7864 0.355426C14.1363 0.109471 15.5291 0.280751 16.7792 0.846441C17.0035 0.947945 17.1637 1.15308 17.2078 1.3953C17.252 1.63752 17.1744 1.88597 17.0003 2.06007L13.2339 5.82652C13.1891 5.87306 13.1641 5.93513 13.1641 5.99974C13.1641 6.06434 13.1891 6.1264 13.2338 6.17294L14.8268 7.76588C14.8733 7.81059 14.9354 7.83559 15 7.83559C15.0646 7.83559 15.1266 7.81059 15.1732 7.76589L18.9396 3.99941C19.1137 3.82531 19.3622 3.74775 19.6044 3.79188C19.8466 3.83602 20.0518 3.99622 20.1533 4.22053C20.719 5.47062 20.8902 6.86342 20.6443 8.21332C20.3983 9.56322 19.7468 10.8061 18.7766 11.7763C17.8063 12.7466 16.5635 13.3981 15.2136 13.644C14.037 13.8584 12.8278 13.7558 11.709 13.3514L5.15031 19.9101C4.61183 20.4485 3.8815 20.7511 3.11998 20.7511C2.35846 20.7511 1.62812 20.4485 1.08965 19.9101C0.55117 19.3716 0.248657 18.6413 0.248657 17.8797C0.248657 17.1182 0.551171 16.3879 1.08965 15.8494L7.64833 9.29073C7.24389 8.17188 7.14129 6.96272 7.35567 5.78615C7.60162 4.43625 8.25313 3.19337 9.22337 2.22313C10.1936 1.25289 11.4365 0.601381 12.7864 0.355426Z" fill="#A0AEC0"/>
</svg>
You could also move your icon by changing the actual d path commands.
This will require to convert your path commands to relative.
This could be done e.g with Yann Armelin's SvgPathEditor
Once all comannds are relative, you just have to change the first M x/y coordinates.
<svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<rect width="32" height="32" rx="4" />
<path d="M20.08 6.86 c -0.66 -0.14 -1.35 -0.15 -2.02 -0.03 c -1.05 0.19 -2.02 0.7 -2.77 1.45 c -0.75 0.75 -1.26 1.72 -1.45 2.77 c -0.19 1.05 -0.06 2.13 0.38 3.11 c 0.13 0.28 0.07 0.62 -0.15 0.84 l -6.91 6.91 c -0.26 0.26 -0.4 0.61 -0.4 0.97 c 0 0.36 0.14 0.71 0.4 0.97 c 0.26 0.26 0.61 0.4 0.97 0.4 c 0.36 0 0.71 -0.14 0.97 -0.4 l 6.91 -6.91 c 0.22 -0.22 0.56 -0.28 0.84 -0.15 c 0.97 0.44 2.06 0.57 3.11 0.38 c 1.05 -0.19 2.02 -0.7 2.77 -1.45 c 0.75 -0.75 1.26 -1.72 1.45 -2.77 c 0.12 -0.67 0.11 -1.36 -0.03 -2.02 l -2.92 2.92 c -0.33 0.32 -0.77 0.5 -1.23 0.5 c -0.46 0 -0.9 -0.18 -1.22 -0.5 l -0.01 -0.01 l -1.61 -1.61 c -0.32 -0.33 -0.5 -0.77 -0.5 -1.23 c 0 -0.46 0.18 -0.9 0.5 -1.22 l 0.01 -0.01 l 2.91 -2.91 z m -2.29 -1.5 c 1.35 -0.25 2.74 -0.07 3.99 0.49 c 0.22 0.1 0.38 0.31 0.43 0.55 c 0.04 0.24 -0.03 0.49 -0.21 0.66 l -3.77 3.77 c -0.04 0.05 -0.07 0.11 -0.07 0.17 c 0 0.06 0.03 0.13 0.07 0.17 l 1.59 1.59 c 0.05 0.04 0.11 0.07 0.17 0.07 c 0.06 0 0.13 -0.02 0.17 -0.07 l 3.77 -3.77 c 0.17 -0.17 0.42 -0.25 0.66 -0.21 c 0.24 0.04 0.45 0.2 0.55 0.43 c 0.57 1.25 0.74 2.64 0.49 3.99 c -0.25 1.35 -0.9 2.59 -1.87 3.56 c -0.97 0.97 -2.21 1.62 -3.56 1.87 c -1.18 0.21 -2.39 0.11 -3.5 -0.29 l -6.56 6.56 c -0.54 0.54 -1.27 0.84 -2.03 0.84 c -0.76 0 -1.49 -0.3 -2.03 -0.84 c -0.54 -0.54 -0.84 -1.27 -0.84 -2.03 c 0 -0.76 0.3 -1.49 0.84 -2.03 l 6.56 -6.56 c -0.4 -1.12 -0.51 -2.33 -0.29 -3.5 c 0.25 -1.35 0.9 -2.59 1.87 -3.56 c 0.97 -0.97 2.21 -1.62 3.56 -1.87 z" fill="#A0AEC0"/>
</svg>
Other benefits:
usually you can decrease the svg file size using relative commands
some graphic apps might already added unnecessarily transforms (like scale(1 1), rotate(0) etc): you can keep your svg more slick and readable
Also described by Lea Verou.
Related
How to morph svg into another svg correctly with Anime.js?
I have a problem where two of my svg have the same number of points, but something isn't right when I play the animation, the two svgs are so close together but the animation just jumps out of nowhere and it isn't right, a weird shape happens before the first svg changes to the second. I'm doing the svgs in Adobe XD. Here is the code: <svg id="morph" viewBox="0 0 1920 540"> <path class="morph" d="m864.216 135.95 36.39 41.917S780.519 307.11 1078.914 373.479s221.979-87.327 221.979-87.327l32.75-34.931s25.473 101.3 207.422 34.931 440.314 150.2 411.2 380.744S34.528 576.079 34.528 576.079s-3.64-429.647 342.063-509.987 272.923 174.653 487.623 69.861"/> </svg> <script> var overlay = document.getElementById('morph'); var morphing = anime({ targets: '.morph', d: [ {value : "m864.216 135.95 36.39 41.917S780.519 307.11 1078.914 373.479s221.979-87.327 221.979-87.327l32.75-34.931s25.473 101.3 207.422 34.931 440.314 150.2 411.2 380.744S34.528 576.079 34.528 576.079s-3.64-429.647 342.063-509.987 272.923 174.653 487.623 69.861"}, {value: "M2.49 576.483S20.535 398.736 122.472 239.61s236.674-199.127 302-217.883c176.407-41.244 334 45.685 334 45.685l340 233.7s172 105.427 280 119.484 322 12.3 322 12.3 118 5.271 160 61.5 56 89.613 62 117.727S2.49 576.483 2.49 576.483Z"}, ], duration: 1200, loop: false, easing: 'easeInOutQuint' }) </script>
Your paths still need some optimizations to be fully compatible for interpolation. Most animation libraries try to make paths compatible to some extent (e.g by converting them to polygons like in flubber.js). But usually you'll get the best results cleaning up your paths manually. step 1 step 2 m 864.216 135.95 M 2.49 576.483 l 36.39 41.917 S 20.535 398.736 122.472 239.61 S 780.519 307.11 1078.914 373.479 s 236.674 -199.127 302-217.883 s 221.979 -87.327 221.979 -87.327 c 176.407 -41.244 334 45.685 334 45.685 l 32.75 -34.931 l 340 233.7 s 25.473 101.3 207.422 34.931 s 172 105.427 280 119.484 s 440.314 150.2 411.2 380.744 s 322 12.3 322 12.3 S 34.528 576.079 34.528 576.079 s 118 5.271 160 61.5 s -3.64 -429.647 342.063-509.987 s 56 89.613 62 117.727 s 272.923 174.653 487.623 69.861 S 2.49 576.483 2.49 576.483 Z Your command types also need to be compatible. E.g. The second animation step has only one l (lineTo) command and a Z (closePath) missing in the first path. Unfortunately, you can't be sure your editor/graphic app will output the same commands as it might decide to use shorthand commands (like h for horizontal lineTos )to minify the markup. Normalize d to a reduced set of commands This will simplify the further adjustments by converting path data to M, C, L and Z commands. I'm using Jarek Foksa's getPathData polyfill. path.getPathData({normalize: true}); {normalize: true} Parameter will also convert all commands to absolute coordinates. Convert L commands to C You can easily convert L commands to C curves by repeating the x/y coordinates like this. L 901 178 to: C 901 178 901 178 901 178 Adjust M starting points Set the starting point to something like the leftmost corner/point. So your paths will be interpolated using a visual reference point. Otherwise you might get weird flipping transitions. Changing the M of a path is also way easier with absolute and normalized commands. You'll also find a helper function in the snippet (1. path data chunk => will be appended after the second chunk) M 864 136 (old starting point => will be deleted) C 901 178 901 178 901 178 C 901 178 781 307 1079 373 C 1377 440 1301 286 1301 286 C 1334 251 1334 251 1334 251 C 1334 251 1359 353 1541 286 C 1723 220 1981 436 1952 667 C 1923 897 35 576 35 576 => will become the new M xy coordinate (2. path data chunk) C 35 576 31 146 377 66 C 722 -14 650 241 864 136 (3. path data chunk: closePath) Z Result: M 35 576 C 35 576 31 146 377 66 C 722 -14 650 241 864 136 C 901 178 901 178 901 178 C 901 178 781 307 1079 373 C 1377 440 1301 286 1301 286 C 1334 251 1334 251 1334 251 C 1334 251 1359 353 1541 286 C 1723 220 1981 436 1952 667 C 1923 897 35 576 35 576 Z Path direction In your case both paths have a clockwise direction. If you encounter weird flipping transitions you can try to reverse path directions. You might use #enxaneta's great codepen example or Svg Path commander Library. Example 1: Normalize and change starting point (including helpers) let svgNorm = document.querySelectorAll('.svgNorm'); svgNorm.forEach(function(svg) { let svgPaths = svg.querySelectorAll('path'); normalizePaths(svgPaths, 0, true); }) let orig1 = document.querySelector('.orig1'); let orig2 = document.querySelector('.orig2'); let path1 = document.querySelector('.morph1'); let path2 = document.querySelector('.morph2'); //shift starting point shiftSvgStartingPoint(path1, 7); //show starting points addMarkers(orig1); addMarkers(orig2); addMarkers(path1); addMarkers(path2); function normalizePaths(paths, decimals = 1, convertLineto = false) { paths.forEach(function(path, i) { let pathData = path.getPathData({ normalize: true }); pathData.forEach(function(com) { let [type, values] = [com['type'], com['values']]; values.forEach(function(coord, c) { com['values'][c] = +(com['values'][c]).toFixed(decimals) }) let [x, y] = [com['values'][0], com['values'][1]]; if (type == 'L' && convertLineto) { com['type'] = 'C'; com['values'] = [x, y, x, y, x, y]; } }) path.setPathData(pathData) }) } function shiftSvgStartingPoint(path, offset) { let pathData = path.getPathData({ normalize: true }); let pathDataL = pathData.length; //exclude Z/z (closepath) command if present let lastCommand = (pathData[pathDataL - 1]['type']); let trimR = 0; if (lastCommand == 'Z') { trimR = 1; } let newStartIndex = offset + 1 < pathData.length - 1 ? offset + 1 : pathData.length - 1 - trimR; let newPathData = pathData; let newPathDataL = newPathData.length; // slice array to reorder let newPathDataStart = newPathData.slice(newStartIndex); let newPathDataEnd = newPathData.slice(0, newStartIndex); // remove original M newPathDataEnd.shift(); let newPathDataEndL = newPathDataEnd.length; let newPathDataEndLastValues = newPathDataEnd[newPathDataEndL - 1]['values']; let newPathDataEndLastXY = [newPathDataEndLastValues[newPathDataEndLastValues.length - 2], newPathDataEndLastValues[newPathDataEndLastValues.length - 1] ]; //remove z(close path) from original pathdata array if (trimR) { newPathDataStart.pop(); newPathDataEnd.push({ 'type': 'Z', 'values': [] }); } // prepend new M command and concatenate array chunks newPathData = [{ 'type': 'M', 'values': newPathDataEndLastXY }].concat(newPathDataStart).concat(newPathDataEnd); // update path's d property path.setPathData(newPathData); return path; } testInterpolation(path1, path2); function testInterpolation(path1, path2) { path1.addEventListener('click', function(e) { if (!path1.getAttribute('style')) { path1.setAttribute('style', `d:path("${path2.getAttribute('d')}")`) } else { path1.removeAttribute('style'); } }) } function addMarkers(path) { let svg = path.closest('svg'); let markerDef = document.createElementNS('http://www.w3.org/2000/svg', 'defs'); let marker = `<marker id="circle" viewBox="0 0 10 10" refX="5" refY="5" markerWidth="10%" markerHeight="10%" orient="auto-start-reverse"> <circle cx="5" cy="5" r="5" fill="green" /> </marker>`; markerDef.innerHTML = marker; svg.insertBefore(markerDef, svg.childNodes[0]); path.setAttribute('marker-start', 'url(#circle)'); } svg { display: inline-block; width: 30%; overflow: visible; border: 1px solid #ccc; margin-right: 5%; } .row { margin-top: 4em; } path { opacity: 0.5; transition: 0.5s; } <script src="https://cdn.jsdelivr.net/npm/path-data-polyfill#1.0.3/path-data-polyfill.min.js"></script> <div> <p>Green points illustrate starting points</p> <svg viewBox="0 0 1920 540"> <path class="orig1" d=" m 864.216 135.95 l 36.39 41.917 S 780.519 307.11 1078.914 373.479 s 221.979 -87.327 221.979 -87.327 l 32.75 -34.931 s 25.473 101.3 207.422 34.931 s 440.314 150.2 411.2 380.744 S 34.528 576.079 34.528 576.079 s -3.64 -429.647 342.063-509.987 s 272.923 174.653 487.623 69.861 z" /> </svg> <svg viewBox="0 0 1920 540"> <path class="orig2" d=" M 2.49 576.483 S 20.535 398.736 122.472 239.61 s 236.674 -199.127 302-217.883 c 176.407 -41.244 334 45.685 334 45.685 l 340 233.7 s 172 105.427 280 119.484 s 322 12.3 322 12.3 s 118 5.271 160 61.5 s 56 89.613 62 117.727 S 2.49 576.483 2.49 576.483 Z" /> </svg> </div> <div class="row"> <svg class="svgNorm" viewBox="0 0 1920 540"> <path class="morph1" d=" m 864.216 135.95 l 36.39 41.917 S 780.519 307.11 1078.914 373.479 s 221.979 -87.327 221.979 -87.327 l 32.75 -34.931 s 25.473 101.3 207.422 34.931 s 440.314 150.2 411.2 380.744 S 34.528 576.079 34.528 576.079 s -3.64 -429.647 342.063-509.987 s 272.923 174.653 487.623 69.861 z" /> </svg> <svg class="svgNorm" viewBox="0 0 1920 540"> <path class="morph2" d=" M 2.49 576.483 S 20.535 398.736 122.472 239.61 s 236.674 -199.127 302-217.883 c 176.407 -41.244 334 45.685 334 45.685 l 340 233.7 s 172 105.427 280 119.484 s 322 12.3 322 12.3 s 118 5.271 160 61.5 s 56 89.613 62 117.727 S 2.49 576.483 2.49 576.483 Z" /> </svg> <p>Click on the left path to see morphing animation. <br />Inspect this path in DevTools to get new compatible path data.</p> </div> Example 2: morph optimized paths with anime.js var morphing = anime({ targets: ".morph", d: [ { value: "M 2 576 C 2 576 21 399 122 240 C 224 80 359 40 424 22 C 601 -20 758 67 758 67 C 1098 301 1098 301 1098 301 C 1098 301 1270 407 1378 421 C 1486 435 1700 433 1700 433 C 1700 433 1818 438 1860 494 C 1902 551 1916 584 1922 612 C 1928 640 2 576 2 576 Z" } ], duration: 1200, loop: false, easing: "easeInOutQuint" }); svg{ display:inline-block; width:20em; overflow:visible; } .morph{ transition:0.5s; } .morphPoly{ transition:0.5s; } <script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.1/anime.min.js"></script> <svg id="morph" viewBox="0 0 1920 540"> <path class="morph" d="M 35 576 C 35 576 31 146 377 66 C 722 -14 650 241 864 136 C 901 178 901 178 901 178 C 901 178 781 307 1079 373 C 1377 440 1301 286 1301 286 C 1334 251 1334 251 1334 251 C 1334 251 1359 353 1541 286 C 1723 220 1981 436 1952 667 C 1923 897 35 576 35 576 Z" /> </svg> ... Quite a lot of work. But once your paths are super compatible you can also morph between shapes via plain css. (E.g by animating/transitioning d:path() properties).
Positioning a clip-path without positioning the clipped element
I'm struggeling to position an element using clip-path: url(#clipdiv). Essentially I want to create two overlapping images, one with a clip-path overlapping the background element without one. On :hover I then want to show the background image, filling the viewport. I don't have any problem positioning the two elements. However, the clip-path always starts on the very left of the page and is not responsive. Adjusting viewBox doesn't change anything. Here a visual representation: Of course I could move and scale the clip-path using css, but then the two elements won't be overlapping anymore. This is my clip-path svg: // It does exactly the same thing without the generated things in the svg tag. // It seems like clip-path doesn't care about those. <svg id="svg-clip" enable-background="new 0 0 1274.57 1034.27" version="1.1" viewBox="0 0 1274.57 1034.27" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"> <clippath id="logoclip"> <path d="m432.81 1034.2c-3.27 0-5.8-0.26-8.25 0.07-2.7 0.37-4.98-1.22-7.59-1.1-2.55 0.12-4.84-1.27-7.27-1.68-7.01-1.17-13.1-4.59-19.37-7.55-2.8-1.32-5.6-2.92-7.91-4.96-4.24-3.75-9.22-6.57-13.04-10.86-5.97-6.69-11.63-13.56-16.43-21.18-3.75-5.96-6.6-12.22-8.99-18.79-1-2.75-2.13-5.44-3.05-8.24-1.16-3.56-1.92-7.2-2.84-10.8-1.06-4.14-2.34-8.28-2.04-12.66-2.2-3.09-0.54-6.81-1.77-10.25-1.1-3.11 0.17-6.97-0.3-10.41-1.9-13.67-0.64-27.4-0.87-41.09-0.24-13.83-0.05-27.66-0.05-41.49v-41.5-40.99-41.49-41.49s-0.76-27.71 0.19-41.48c1.25-18.05 0.54-36.06 0.76-54.09 0.22-18.16 0.05-36.33 0.05-54.49v-54.99-54.49s0-36.33 0-54.49c2.01-13.15 0.74-26.39 0.95-39.58 0.22-13.49 0.05-26.99 0.05-40.49v-39.99s0-26.66 0-39.99 0-26.66 0-39.99v-40.49c0-13.33 0.07-26.66-0.05-39.99-0.03-3.62 1.01-6.79 2.51-9.98 2.62-5.57 5.02-11.25 7.54-16.87 1.64-3.65 3.55-7.21 4.93-10.95 1.49-4.03 3.97-7.49 6.42-10.79 3.63-4.89 8.99-7.99 14.61-10.34 3.26-1.37 6.66-2.42 10.03-3.53 2.35-0.78 4.7-1.6 7.12-2.09 2.46-0.49 4.81-1.46 7.42-1.5 1.81-0.03 3.6-0.88 5.39-1.37 0.6-0.16 1.17-0.46 1.78-0.52 3.52-0.37 7.08-0.52 10.56-1.08 2.03-0.33 3.95-1.05 6.09-1.01 1.85 0.03 3.71-0.74 5.58-0.89 2.15-0.17 4.44 0.41 6.47-0.12 9.46-2.47 19.08-1.88 28.67-1.91 9.82-0.04 19.65-0.05 29.47 0.04 1.53 0.01 3.05 0.64 4.58 0.95 1.38 0.28 2.94-0.57 4.19 0.83 0.31 0.35 1.25 0.18 1.89 0.17 5-0.13 9.87 0.5 14.68 1.95 1.37 0.41 2.99-0.06 4.47 0.1 1.22 0.14 2.37 0.74 3.59 0.94 9.75 1.59 19 4.63 27.27 10.1 1.59 1.05 2.97 3.08 3.48 4.93 0.47 1.69 2.59 3.74 0.15 5.63 0.04 6.39-3.62 11.48-6 17.01-2.62 6.08-5.14 12.22-8.05 18.15-2.01 4.1-3.05 8.13-3.03 12.79 0.16 36.66 0.09 73.32 0.09 109.98-2.03 15.66-0.73 31.38-0.95 47.08-0.22 15.99-0.05 31.99-0.05 47.99v47.49 47.49 47.99c0 15.83 0.82 31.72-0.23 47.48-1.06 15.89-0.47 31.73-0.72 47.59-0.25 15.83-0.05 31.66-0.05 47.49v47.99 47.99 47.49c0 16 0.78 32.04-0.22 47.98-0.96 15.22-0.52 30.4-0.73 45.59-0.21 15.16-0.05 30.33-0.05 45.49v45.99c-1.5 6.47-0.42 13.1-1.19 19.56-0.42 3.55-0.62 7.06-0.84 10.6-0.11 1.71-0.61 3.4-0.96 5.09-0.38 1.85 0.5 3.71-0.84 5.69-0.85 1.26 0.31 3.72-0.24 5.36-2.05 6.06-1.9 12.65-4.8 18.51-0.87 1.76-0.33 4.23-1.22 5.98-3.21 6.33-5.08 13.27-8.88 19.33-3.35 5.35-6.82 10.59-10.72 15.58-3.47 4.44-7.35 8.44-11.47 12.16-5.17 4.67-10.61 9.05-16.76 12.5-5.29 2.97-10.72 5.4-16.55 7.14-2.06 0.62-4.18 1.16-6.25 1.74-2.11 0.59-4.49 0.7-6.51 1.26-4.9 1.3-9.77 0.33-13.85 0.77zm66.89-1011.1c0.1-0.27 0.19-0.53 0.29-0.8-1.96-1.35-3.76-3.15-5.92-3.98-5.87-2.25-12.14-2.96-18.3-4.01-2.75-0.47-5.65-0.08-8.48-0.08h-8.49c-3 0-6.01-0.16-8.99 0.05-2.72 0.19-5.42-0.57-8.21 0.66-2.41 1.07-5.47-0.34-7.96 1.29-4.69-0.22-8.96 1.52-13.23 3.04-6.29 2.24-11.6 5.72-14.45 12.18-1.49 3.39-3.74 6.49-4.85 9.98-1.18 3.72-3.37 6.91-4.61 10.61-1.62 4.78-4.33 9.19-6.47 13.8-0.73 1.57-1.08 3.23-1.08 5.07 0.08 18.33 0.05 36.66 0.05 54.99s0 36.66 0 54.99c0 18.5 0.18 37-0.05 55.49-0.23 18.19 0.43 36.37-0.75 54.59-0.99 15.27-0.2 30.65-0.2 45.98v46.49 45.99 46.49c0 15.33 0.19 30.66-0.05 45.99-0.24 15.36 0.18 30.7-0.7 46.09-1.05 18.44-0.25 36.98-0.25 55.48v55.99 55.49c0 18.66 0.18 37.33-0.05 55.99-0.23 18.36 0.32 36.71-0.71 55.09-0.85 15.13-0.99 30.39 0.69 45.57 0.47 4.28 0.07 8.66 0.07 12.99 0 2.5-0.52 5.15 0.15 7.45 0.61 2.08 1.1 4.1 0.77 6.12-0.37 2.25 1.09 4.02 1.07 6.1-0.04 3.69 1.04 7.19 2.06 10.65 1.52 5.17 3.11 10.26 5.78 15.11 3.69 6.7 8.71 11.88 14.74 16.26 3.15 2.29 6.74 3.96 10.46 4.83 4.07 0.95 8.31 1.09 12.55 1.22 8.51 0.24 15.8-3.04 22.26-7.77 5.15-3.77 9.19-8.96 12.16-14.85 3.32-6.59 4.67-11.73 6.07-18.01 1.17-5.24 1.52-10.58 2.7-15.82 0.87-3.87 0.41-8.01 1-12.07 0.82-5.61 0.09-11.35 0.98-17.09 0.81-5.21 0.17-10.64 0.17-15.97s0-10.66 0-16 0.23-10.68-0.07-15.99c-0.3-5.27 0.99-10.39 1.03-15.59 0.1-14 0.03-27.99 0.03-41.99v-41.49-41.99s0-27.99 0-41.99c0-13.83-0.18-27.66 0.05-41.49 0.24-13.86-1.11-27.76 0.95-41.58v-66.49-66.49c0-22.33-0.16-44.66 0.05-66.99 0.2-22.03-1.02-44.07 0.95-66.07v-187.96-50.81c2.05-4.17 4.48-8.03 5.84-12.25 0.97-3.01 2.54-5.63 3.75-8.46 1.27-2.97 2.56-5.94 3.89-8.89 1.14-2.53 2.43-4.99 3.46-7.56 0.46-1.14-0.09-2.43 0.62-3.76 0.5-0.87-0.45-2.52-0.77-3.82z"/> <path d="m54.27 118.23v156.74h-53.5c-0.77-4.33-1.11-251.68-0.32-271.82h26.32 26.34c1.12 2.2 2.36 4.52 3.52 6.89 6.21 12.75 12.59 25.43 18.54 38.31 4.08 8.83 8.96 17.29 12.75 26.21 4.05 9.54 9.08 18.55 13.36 27.95 4.03 8.84 9.07 17.24 12.77 26.2 2.89 7 6.63 13.53 9.63 20.69 1.98-4.15 3.84-8.05 5.71-11.94 4.35-9.03 8.89-17.97 13.01-27.1 3.3-7.33 7.46-14.25 10.5-21.64 3.42-8.3 7.84-16.07 11.51-24.22 3.61-8.01 8.16-15.62 11.47-23.74 3.39-8.31 7.94-16.02 11.45-24.25 1.87-4.39 3.98-8.68 6.07-13.19h53.47v271.83h-26.26-26.31v-156.7c-0.23-0.06-0.46-0.12-0.69-0.18-2.82 5.64-5.64 11.29-8.45 16.94-3.43 6.91-6.56 13.99-10.34 20.7-11.38 20.2-20.64 41.48-31.63 61.88-0.37 0.68-0.67 1.39-1.05 2.19h-35.92c-1.22-2.43-2.56-5.23-4.02-7.96-12.68-23.69-24.24-47.94-36.56-71.81-3.61-7.01-7.23-14.02-11.37-21.98z"/> <path d="m2.45 374.24h52.66c2.03 3.8 4.34 7.51 6.07 11.48 4.96 11.31 10.75 22.21 15.93 33.39 4.15 8.97 9.08 17.58 12.93 26.63 4 9.39 9.14 18.19 13.13 27.55 3.82 8.96 8.82 17.34 12.7 26.23 3.02 6.94 6.62 13.58 9.78 20.74 4.89-10.07 9.73-19.97 14.52-29.89 5.02-10.41 10.17-20.77 14.94-31.3 3.44-7.6 7.66-14.84 10.87-22.49 3.66-8.7 8.43-16.83 12.13-25.47 3.29-7.68 7.44-14.92 10.84-22.51 2.14-4.77 4.53-9.44 6.56-14.37h53.44v271.43c-3.91 0.69-40.08 0.91-52.83 0.28v-157.59c-17.65 34.83-34.86 68.78-52.06 102.71h-35.73c-2.03-3.81-4.15-7.6-6.1-11.47-11.46-22.74-22.67-45.61-34.43-68.2-3.67-7.05-7.29-14.16-11.52-22.11v156.77h-53.82c-0.01-90.49-0.01-180.93-0.01-271.81z"/> <path d="m5.44 747.24h52.72c2.35 4.51 4.99 8.91 7.02 13.59 4.6 10.63 10.16 20.78 14.95 31.3 4.1 9 9.05 17.59 12.92 26.64 4.01 9.39 9.13 18.2 13.13 27.55 3.83 8.95 8.83 17.34 12.71 26.23 3.03 6.94 6.63 13.57 9.73 20.62 2.13-4.15 4.6-8.06 6.23-12.29 3.51-9.1 8.51-17.46 12.49-26.32 3.29-7.31 7.38-14.27 10.45-21.67 3.5-8.43 8.19-16.26 11.69-24.65 3.28-7.85 7.47-15.23 11.03-22.92 3.89-8.39 8.01-16.67 11.97-25.03 2.04-4.32 3.94-8.7 5.91-13.05h53.57v271.66h-52.87v-157.52c-17.63 34.79-34.84 68.75-52.03 102.66h-35.79c-2.27-4.38-4.58-8.76-6.82-13.17-10.96-21.62-21.87-43.26-32.87-64.86-3.88-7.63-7.96-15.16-12.16-23.14v155.72c-4.25 0.76-40.73 0.99-53.98 0.36v-271.71z"/> <path d="m915.81 112.82c0.53 0.53 0.88 0.88 1.4 1.41h106.22v46.72h-106.21c-0.51 0.62-0.92 1.13-1.49 1.83v64.23h125.58v48h-178.42v-271.73h178.43v46.79h-124.11l-1.4 1.4v61.35z"/> <path d="m865.17 374.15h177.84c0.75 4.04 0.98 33.12 0.35 46.84h-124.07l-1.66 1.66v58.88c0 1.32-0.31 2.76 2.52 3.62h105.24v46.86h-106.63c-0.44 1.1-1.03 1.94-1.08 2.81-0.14 2.32-0.05 4.66-0.05 7v56.29h125.81v47.87h-178.27c-0.69-3.73-0.72-267.55 0-271.83z"/> <path d="m920.8 856.82c0.52 0.52 0.87 0.88 1.32 1.32h53.32 52.98v47h-4.29c-32.8 0-65.61-0.01-98.41 0.02-1.72 0-3.73-0.75-5 1.45v64.39h125.58v48.01h-178.41v-271.72h178.42v46.78h-124.1l-1.4 1.4c-0.01 20.27-0.01 40.72-0.01 61.35z"/> <path d="m1068.8 241.38c5.73-5.74 10.89-10.9 16.05-16.07 5.53-5.54 11.08-11.07 16.6-16.63 0.95-0.96 1.81-1.97 2.98-1.62 3.13 2.61 5.89 5.13 8.88 7.34 3.75 2.76 7.67 5.2 12.14 6.87 3.9 1.46 7.75 3.03 11.78 4.13 2.09 0.57 4.17 1.21 6.28 1.73 1.67 0.41 3.37 0.76 5.08 0.99 1.56 0.21 3.16-0.26 4.64 0.94 0.6 0.49 1.93 0.08 2.93 0.08 7.33 0 14.66-0.03 21.98 0.01 6.42 0.04 12.43-1.73 18.49-3.62 5.33-1.66 9.9-4.39 13.4-8.6 3.53-4.25 6.43-8.93 6.44-14.83 0-1.2 0.74-2.37 0.92-3.59 0.17-1.14 0.24-2.37 0-3.49-0.98-4.43-0.95-9.05-2.85-13.31-3.49-7.84-9-11.94-16.74-14.51-4.75-1.58-9.57-2.95-14.71-3.24-2.48-0.14-5.22-0.28-7.53-1.02-2.45-0.78-5-0.07-7.08-0.96-2.44-1.05-5.01-0.09-7.08-1-2.44-1.07-4.8-0.45-7.14-0.9-4.04-0.78-8.04-1.75-12.17-1.96-1.46-2.2-3.94-0.37-5.89-1.54-1.59-0.95-3.7-1.85-5.86-1.46-5.87-3.09-12.24-4.96-18.04-8.4-6.87-4.07-12.5-9.34-17.61-15.14-4.08-4.64-6.87-10.28-9.28-16.1-1.61-3.9-2.03-8.12-3.89-11.89 0.66-3.14-1.02-6-1.05-9.09-0.03-3.2 0.48-6.41-0.8-9.64-0.53-1.35-0.8-3.45 0.61-5.16 0.58-0.71 0.22-2.22 0.24-3.36 0.15-11.54 3.21-22.3 8.69-32.4 2.81-5.18 5.9-10.17 10.23-14.27 2.06-1.95 4.02-3.99 6.01-6 3.83-3.89 8.45-6.66 13-9.61 5.92-3.84 12.38-6.34 19.04-8.35 3.57-1.08 7.16-2.22 10.92-2.62 1.55-0.16 3.05-0.72 4.59-0.95 1.4-0.21 2.91 0.35 4.13-0.97 0.31-0.33 1.28-0.01 1.94-0.06 5.02-0.36 10.15 0.9 15.09-0.96 0.58-0.22 1.43-0.26 1.97 0.01 3.59 1.76 7.4 0.7 11.1 0.95 2.3 0.15 4.88-0.48 6.84 0.37 2.35 1.03 5.01-0.42 6.61 0.8 2.05 1.56 4.74-0.4 6.29 1.84 6.75 0 12.71 3 18.89 5.07 5.41 1.81 10.55 4.25 15.51 7.22 4.58 2.74 8.84 5.91 13.36 8.72 0.27 0.17 0.52 0.38 0.76 0.59 2.29 2.03 4.57 4.07 6.91 6.16 0 0.05 0.01 0.22 0 0.39-0.02 0.15-0.01 0.36-0.1 0.45-11.06 11.09-22.13 22.16-33.24 33.28-7.84-7.17-17.04-11.87-27.16-14.87-3.32-0.99-6.86-1.34-10.09-2.27-3.53-1.01-6.99-0.25-10.45-1.16-3.25-0.85-6.84-0.6-10.28-0.52-2.37 0.05-4.72 0.6-7.08 0.95-2.2 0.32-4.42 0.52-6.57 1.04-2.24 0.54-4.47 1.25-6.58 2.18-1.56 0.68-2.86 1.91-4.35 2.77-7.23 4.17-10.98 10.95-13.86 18.38 0.08 4.54-2.82 9.05-0.13 13.62 0.11 6.15 3.5 10.84 7.5 14.83 3.99 3.98 9.07 6.66 14.57 8.11 3.64 0.96 7.27 1.93 11.14 2.21 4.89 0.35 9.75 1.42 14.65 2.04 2.17 0.28 4.52 0.27 6.57 0.93 2.23 0.72 4.49 0.42 6.6 0.97 4.41 1.14 8.93 1.81 13.35 2.59 6.52 1.15 12.71 3.06 18.81 5.37 6.4 2.42 12.62 5.28 17.97 9.69 2.12 1.75 4.31 3.42 6.28 5.32 5.42 5.23 9.26 11.55 12.51 18.3 1.29 2.68 1.97 5.52 2.93 8.29 0.92 2.65 1.59 5.38 2.26 8.1 0.66 2.71-0.04 5.57 1.12 7.99 1.26 2.61 0.39 5.18 0.59 7.75 0.22 2.82 0.05 5.66 0.05 8.5 0 2.67 0.49 5.45-0.1 7.98-1.43 6.2-2.19 12.48-4.6 18.57-2.56 6.43-6.04 12.21-9.48 18.06-0.98 1.67-2.63 3.05-4.21 4.23-1.37 1.02-1.74 2.67-3.35 3.67-2.71 1.68-4.78 4.3-7.37 6.32-8.84 6.88-18.72 11.56-29.2 15.24-4.39 1.54-8.95 2.48-13.39 3.82-3.48 1.05-7.4 0.51-11.02 1.2-10.66 2.01-21.39 0.47-32.08 0.88-2.34 0.09-4.72-0.58-7.08-0.94-2.19-0.34-4.34 0.17-6.67-0.79-2.02-0.83-4.65-0.75-7.01-1.11-7.26-1.11-18.16-4.28-26.38-7.54-4.18-1.65-8.22-3.58-12.14-5.66-5.97-3.17-11.74-6.77-16.79-11.38-3.02-2.72-6.19-5.26-9.74-8.28z"/> <path d="m1071.5 612.56c11.52-11.53 22.78-22.8 34.38-34.41h0.65c2.85 2.34 5.55 4.65 8.35 6.84 3.94 3.09 8.18 5.5 12.96 7.32 5.07 1.93 10.1 3.78 15.35 5.21 2.26 0.61 4.59 0.72 6.85 1.48 2.82 0.95 6 0.94 9.03 1.11 2.99 0.17 5.99 0.04 8.99 0.04 4.83 0 9.69 0.35 14.48-0.08 7.48-0.67 14.71-2.41 21.54-5.86 7.47-3.76 11.37-10.17 14.3-17.5-0.49-3.93 2.01-7.68 0.99-11.54-1.12-4.23-0.89-8.72-2.88-12.8-3.69-7.57-8.94-11.55-16.56-14.14-4.73-1.61-9.58-2.86-14.71-3.22-4.89-0.34-9.69-1.88-14.67-1.86-2.19-1.57-4.94-0.28-7.02-1.15-2.44-1.03-4.86-0.3-7.12-0.92-4.39-1.21-9.08-0.93-13.31-2.82-3.63 0.55-6.73-1.5-10.09-2.23-3.41-0.74-6.61-2.49-9.9-3.78-10.71-4.19-19.43-11.22-26.66-19.9-3.93-4.72-6.78-10.3-9.1-16.18-1.49-3.78-2.22-7.72-3.59-11.5-1.07-2.93-0.87-6.32-1.2-9.51-0.32-3.03 0.44-6.08-0.84-9.15-0.55-1.31-0.9-3.51 0.55-5.17 0.43-0.49 0.38-1.58 0.27-2.35-0.63-4.45 0.25-8.89 1.2-13.05 1.85-8.11 4.71-15.9 9.03-23.25 4.56-7.77 10.89-13.75 17.2-19.79 3.02-2.9 6.96-4.82 10.43-7.26 3.58-2.51 7.55-4.25 11.56-5.88 4.3-1.76 8.82-2.87 13.28-4.13 4.69-1.32 9.55-1.73 14.29-2.83 3.32-0.77 6.96-0.07 10.46-0.18 1.72-0.06 3.5 0.61 5.17-0.87 0.65-0.58 2.52-0.53 3.36-0.01 2.48 1.54 5.13 1.04 7.62 0.83 5.45-0.46 10.85 0.32 16.05 1.26 10.05 1.81 19.91 4.45 29.49 8.32 7.58 3.06 14.23 7.55 21.18 11.58 2.62 1.52 4.7 3.93 7.07 5.9 1.55 1.29 3.17 2.5 4.52 3.56-11.41 11.42-22.56 22.58-33.94 33.96-4.52-5.12-11.24-8.19-17.77-11.39-3.98-1.95-8.37-3.16-12.77-4.16-4.85-1.09-9.73-1.6-14.65-2.14-3.2-0.35-6.39-0.9-9.6-0.76-3.87 0.16-7.77 0.36-11.57 1.04-3.65 0.65-7.24 1.76-10.74 2.99-1.72 0.6-3.19 1.94-4.78 2.93-8.15 5.07-10.83 10.57-13.9 18.29-0.01 4.53-2.92 9.01-0.21 13.58-0.23 5.48 2.96 9.63 6.03 13.45 3.37 4.2 8.21 6.86 13.33 8.64 4.6 1.6 9.2 3.41 14.24 3.03 2.21 1.39 4.84 0.43 7.04 1.13 2.4 0.78 4.9 0.28 7.08 1.01 2.41 0.8 4.91 0.27 7.08 1 2.25 0.76 4.54 0.32 6.6 0.95 4.37 1.33 9.11 0.81 13.28 2.9 6.89 0.03 13.17 2.85 19.33 5.22 6.14 2.36 12.3 5.23 17.49 9.71 2.07 1.79 4.28 3.43 6.24 5.37 4.78 4.74 8.3 10.34 11.3 16.32 2.48 4.95 4.71 13.19 5.95 18.05 2.76 10.82 2.01 21.79 1.73 32.69-0.12 4.57-1.48 9.24-2.8 13.77-1.3 4.48-3.37 8.62-5.43 12.75-2.57 5.13-5.56 10-9.87 13.91-1.46 1.33-2.32 3.14-4.12 4.27-1.79 1.12-3.02 3.09-4.68 4.47-1.56 1.3-3.37 2.3-5.04 3.47-1.68 1.18-3.2 2.69-5.02 3.58-6.92 3.37-13.65 7.15-21.07 9.47-4.43 1.39-8.96 2.44-13.4 3.8-3.47 1.06-7.41 0.48-11.02 1.21-9.33 1.87-18.72 0.58-28.08 0.86-3.01 0.09-6.02 0.52-9.14-0.77-2.71-1.12-6.16 0.75-9.01-1.16-4.72 0.46-9.1-1.43-13.64-2.15-4.84-0.77-9.55-2.57-14.21-4.21-6.55-2.3-12.86-5.2-18.91-8.63-5.5-3.12-10.69-6.64-15.6-10.68-3.15-2.58-6.09-5.26-8.7-7.9z"/> <path d="m1267.6 775.8c-11.57 11.58-22.74 22.75-33.93 33.96-7.35-6.91-16.51-11.45-26.41-14.55-3.43-1.08-6.89-2.48-10.64-2.06-3.18-2.18-6.91-0.5-10.37-1.45-3.24-0.89-6.85-0.57-10.29-0.49-2.37 0.06-4.72 0.6-7.08 0.95-2.2 0.32-4.43 0.51-6.57 1.04-2.24 0.55-4.41 1.38-6.58 2.2-0.86 0.32-1.7 0.82-2.41 1.41-3.48 2.92-7.67 4.91-10.22 9.06-2.64 4.31-4.85 8.57-5.79 13.65-0.54 2.89-1.34 5.84-0.68 8.57 0.45 1.89 0.73 3.72 0.83 5.43 1.97 2.65 3.13 5.6 4.8 8.24 2.2 3.47 5.32 5.42 8.51 7.34 6.1 3.67 12.75 5.66 19.95 6.23 2.49 0.2 5.21 0.25 7.54 0.99 2.43 0.77 4.96 0.17 7.07 0.99 2.27 0.88 4.57 0.27 6.6 0.97 2.23 0.77 4.5 0.41 6.6 0.97 4.4 1.18 9.1 0.86 13.3 2.84 6.69 0.22 12.76 2.86 18.86 5.14 6.4 2.39 12.61 5.3 17.96 9.71 1.99 1.64 4.04 3.21 5.93 4.97 5.19 4.82 8.82 10.77 12.02 17.01 2.13 4.16 4.48 13.29 5.93 18.06 0.83 2.73-0.01 5.54 1.19 7.98 1.28 2.58 0.38 5.18 0.57 7.75 0.21 2.82 0.05 5.66 0.05 8.5 0 2.67 0.5 5.45-0.1 7.98-1.46 6.19-2.16 12.48-4.64 18.56-2.61 6.4-5.89 12.3-9.52 18.04-1.76 2.78-4.21 5.33-6.86 7.28-2.61 1.92-4.05 5.21-7.41 6.16-5.78 5.49-12.9 8.71-19.98 12.08-5.49 2.62-11.31 4.09-17.02 5.98-4.05 1.34-8.36 1.25-12.29 2.87-0.28 0.12-0.66-0.01-0.99 0.02-3.86 0.33-7.71 0.8-11.58 0.96-3.99 0.17-7.99 0.04-11.99 0.04-2.33 0-4.69-0.21-6.99 0.04-5.77 0.64-11.41-0.76-17.06-1.29-4.39-0.41-8.91-1.44-13.33-2.53-3.61-0.89-7.38-1.5-10.95-2.62-8.39-2.64-16.58-5.84-24.25-10.2-5.77-3.28-11.43-6.7-16.33-11.28-2.83-2.65-5.91-5.03-8.84-7.49 1.38-2.02 32.06-33.51 33.67-34.51 0.49-0.3 1.28-0.12 1.63-0.14 3.28 2.79 6.15 5.76 9.53 7.96 3.6 2.34 7.18 4.74 11.41 6.21 3.92 1.36 7.76 2.98 11.77 4.14 1.93 0.56 3.83 1.44 5.79 1.64 5.08 0.51 9.97 2.24 15.16 2.09 5.33-0.15 10.66-0.03 15.99-0.03 1.33 0 2.67-0.07 4 0.01 4.76 0.29 11.33-1.56 18.47-3.67 5.03-1.49 9.3-4.03 12.71-7.87 3.92-4.42 6.99-9.28 7.11-15.56 0.04-2.18 1.3-4.27 0.94-6.59-0.7-4.51-0.96-9.15-2.67-13.4-3.13-7.75-9.25-12.41-17.02-14.87-4.78-1.51-9.58-2.92-14.72-3.24-2.3-0.14-4.85-0.27-7.05-0.95-2.41-0.75-4.89-0.28-7.08-0.99-2.57-0.84-5.31-0.17-7.56-1.04-2.46-0.95-4.89-0.21-7.12-0.91-4.36-1.37-9.13-0.73-13.27-2.92-3.68 0.81-6.88-1.22-10.11-2.18-6.01-1.8-11.95-4.11-17.41-7.38-5.84-3.5-11.05-7.75-15.74-12.7-5.51-5.81-9.45-12.42-12.29-19.93-1.9-5.04-2.99-10.13-4.06-15.35-0.74-3.59-0.59-7.08-0.83-10.62-0.07-1.09-0.18-2.1-0.66-3.22-0.64-1.51-0.74-3.81 0.01-5.2 0.81-1.52 0.59-2.85 0.63-4.25 0.29-11.68 3.28-22.59 9.01-32.78 2.81-5.01 5.8-9.85 9.98-13.87 4.02-3.86 7.78-7.98 12.28-11.35 3.23-2.41 12.6-7.53 16.67-9.25 2.99-1.26 5.98-2.58 9.09-3.35 3.63-0.91 7.15-2.3 10.94-2.6 1.54-0.12 3.04-0.74 4.59-0.93 1.41-0.18 2.89 0.22 4.13-0.98 0.34-0.33 1.29-0.02 1.95-0.06 5.03-0.3 10.14 0.8 15.08-0.97 0.44-0.16 1.04-0.16 1.48 0 5.11 1.83 10.39 0.59 15.58 1.01 1.88 0.15 3.72 0.65 5.58 0.97 1.7 0.29 3.36-0.26 5.18 0.83 1.41 0.84 3.67 0.78 5.5 1.01 4.25 0.54 8.22 1.85 12.23 3.16 6.61 2.15 13.17 4.37 19.19 7.98 4.84 2.9 9.85 5.5 14.18 9.22 3.03 2.55 6.26 4.88 9.52 7.42z"/> <path d="m610.85 3.18h54.81c0.66 1.48 1.94 3.12 2.04 4.83 0.26 4.35 2.74 7.95 3.53 12.07 1.05 5.5 3.73 10.52 4.66 16.09 0.48 2.84 2.1 5.47 2.87 8.28 1.79 6.57 3.97 13.02 6.03 19.5 2.3 7.21 4.57 14.45 6.7 21.69 2.05 6.98 4.49 13.85 6.37 20.89 1.87 7.01 4.67 13.77 6.47 20.79 1.59 6.17 3.8 12.12 5.51 18.23 1.95 6.99 4.59 13.78 6.5 20.78 1.1 4.02 2.29 7.97 3.87 12.18 1.41-4.36 2.97-8.26 3.92-12.3 1.28-5.45 3.78-10.5 4.72-16.07 0.48-2.84 2.15-5.46 2.86-8.28 1.97-7.82 4.88-15.33 7.09-23.07 1.99-6.98 4.67-13.77 6.49-20.78 1.6-6.16 3.81-12.11 5.52-18.23 1.95-6.99 4.68-13.76 6.48-20.78 1.59-6.17 3.8-12.12 5.51-18.23 1.95-6.99 4.59-13.78 6.51-20.78 1.28-4.64 2.64-9.21 4.37-13.69 0.32-0.84 0.05-1.91 0.05-3h55.98c-0.35 1.82-0.38 3.73-1.07 5.36-4.14 9.69-6.36 20-9.87 29.9-4.03 11.35-7.47 22.89-11.28 34.32-3.85 11.56-7.9 23.05-11.75 34.62-4.15 12.45-8.13 24.95-12.25 37.41-4.55 13.77-9.04 27.57-13.78 41.28-5.45 15.75-10.26 31.71-15.71 47.46-4.28 12.39-8.54 24.83-12.25 37.42-0.39 1.33-0.9 2.62-1.38 4.02h-40.5c-1.36-4.45-2.67-8.89-4.09-13.3-3.71-11.46-7.42-22.91-11.23-34.34-3.51-10.53-7.32-20.97-10.7-31.55-3.01-9.42-6.46-18.69-9.19-28.2-0.84-2.93-1.55-5.96-2.79-8.83-1.28-2.96-2.04-6.15-3.07-9.23-0.97-2.93-2.01-5.83-2.99-8.76-4.2-12.59-8.36-25.19-12.57-37.78-4.07-12.14-7.74-24.41-12.35-36.37-0.6-6.44-3.73-12.14-5.38-18.28-1.64-6.1-3.89-12.04-5.93-18.03-2.88-8.47-5.83-16.91-8.72-25.38-0.14-0.45-0.01-0.98-0.01-1.86z"/> <path d="m612.41 374.25h55.33c0.69 1.56 1.91 3.09 1.97 4.66 0.16 4.2 2.31 7.78 3.32 11.69 0.71 2.74 1.58 5.63 2.58 8.39 0.98 2.7 1.93 5.57 2.43 8.56 0.46 2.74 1.94 5.49 2.74 8.3 1.9 6.7 3.99 13.35 6.14 19.96 2.24 6.9 4.25 13.87 6.54 20.76 1.75 5.26 3.61 10.55 5.02 15.91 1.19 4.52 3.03 8.82 4.13 13.27 1.08 4.41 3 8.52 3.95 12.86 0.98 4.45 2.96 8.53 3.93 12.88 0.98 4.43 2.94 8.52 3.93 12.88 1.41 6.22 3.9 12.1 5.4 18.28 0.54 2.23 1.5 4.37 2.32 6.71 3.44-8.54 4.93-17.46 8.59-25.66 0.67-6.25 3.45-11.91 5.12-17.88 2.25-8.03 5.34-15.82 7.49-23.86 1.64-6.15 3.76-12.13 5.48-18.25 1.96-6.98 4.71-13.75 6.53-20.77 1.6-6.16 3.75-12.14 5.47-18.25 1.96-6.98 4.73-13.75 6.54-20.76 1.59-6.17 3.94-12.08 5.41-18.27 0.57-2.41 1.38-4.76 2.1-7.12 0.41-1.33 0.86-2.65 1.37-4.22h55.45c-0.32 1.72-0.33 3.63-1.04 5.22-1.77 3.98-2.95 8.12-4.14 12.29-1.15 4.01-2.51 7.95-3.79 11.92-1.33 4.12-2.64 8.23-4 12.34-3.74 11.28-7.47 22.56-11.25 33.83-3.54 10.53-7.21 21.01-10.71 31.55-4.14 12.45-8.12 24.96-12.24 37.42-3.87 11.72-7.83 23.41-11.76 35.11-1.47 4.39-3.19 8.7-4.43 13.15-2.77 9.98-6.39 19.69-9.58 29.53-3.43 10.57-7.07 21.06-10.58 31.6-1.95 5.86-3.83 11.75-5.79 17.77h-40.48c-1.35-4.34-2.67-8.78-4.1-13.18-4.05-12.48-8.1-24.97-12.22-37.43-3.87-11.72-7.82-23.42-11.76-35.12-2.42-7.17-5.21-14.22-6.99-21.6-2.04-1.19-0.33-3.63-1.88-5.29-1.13-1.2-1.09-3.48-1.61-5.27-0.48-1.63-0.96-3.27-1.52-4.87-0.61-1.74-1.4-3.42-1.97-5.18-3.1-9.55-6.07-19.14-9.23-28.67-3.5-10.54-7.2-21.01-10.75-31.53-2.23-6.58-4.64-13.11-6.46-19.81-2.47-9.12-5.86-17.92-8.61-26.94-2.88-9.44-6.3-18.71-9.46-28.06-0.97-2.78-1.86-5.58-2.93-8.85z"/> <path d="m615.75 747.26h54.92c0.68 1.44 1.98 2.96 2.03 4.52 0.11 4.22 2.21 7.83 3.32 11.69 0.79 2.74 1.46 5.66 2.54 8.41 1.03 2.62 2.13 5.48 2.4 8.56 0.24 2.82 1.93 5.49 2.82 8.27 2.06 6.48 4.02 13 6.01 19.5 2.14 6.95 4.31 13.88 6.39 20.84 1.68 5.62 3.17 11.31 5.6 16.68-0.38 3.3 1.66 6 2.26 9.08 0.56 2.85 1.83 5.56 2.73 8.35 2.27 7.06 4.44 14.16 6.59 21.25 2.16 7.1 4.39 14.2 6.44 21.34 1.57 5.49 3.39 10.9 5.21 16.68 3.68-8.59 5.01-17.5 8.61-25.66 0.25-5.24 3.06-9.75 4.23-14.76 1.12-4.79 3.11-9.37 4.57-14.08 0.92-2.97 1.47-6.05 2.36-9.03 0.88-2.95 2.02-5.83 2.96-8.77 2.28-7.06 4.07-14.26 6.66-21.23 1.08-2.9 1.48-6.04 2.37-9.02 0.88-2.95 2.02-5.83 2.96-8.77 2.28-7.06 4.45-14.16 6.58-21.25 1.82-6.08 3.78-12.12 5.49-18.24 1.95-6.98 4.45-13.81 6.63-20.73 0.33-1.05 0.28-2.22 0.43-3.55h56.14c-14.46 45.66-29.9 90.74-44.92 135.96-14.99 45.12-29.74 90.32-44.66 135.67h-40.54c-1.32-4.18-2.69-8.61-4.11-13.01-4.38-13.51-8.74-27.03-13.19-40.52-4.54-13.77-9.17-27.52-13.79-41.27-1.47-4.38-3.29-8.67-4.5-13.12-2.4-8.81-5.57-17.35-8.46-25.99-3.18-9.52-6.1-19.13-9.27-28.65-3.5-10.54-7.27-20.99-10.68-31.56-1.43-4.41-3-8.77-4.23-13.26-1.25-4.6-2.8-9.14-4.46-13.63-1.6-4.34-2.91-8.79-4.37-13.19-3.84-11.57-7.71-23.13-11.54-34.7-0.27-0.86-0.34-1.79-0.53-2.81z"/> </clippath> </svg> And this is the layout: <img id="logoVideo" src="https://images.vice.com/motherboard/content-images/article/20449/1427798070375676.jpg"> <div class="logo-box"> <svg id="svg-clip" enable-background="new 0 0 1274.57 1034.27" version="1.1" viewBox="0 0 1274.57 1034.27" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"> <clippath id="logoclip"> // The whole SVG is above </clippath> </svg> <div> In a css file I style #logoVideo with clip-path: url(#logoclip). I hope someone here is smart enough. Thank you very much in advance.
Non linear regression on Scilab
I'm new to scilab (I'm using 5.5.2), and I need to make a non linear regression. I have a dataset of points which behaves like a sinewave, so I want to find the parameters of this sinewave. Here is my dataset : t1=[11800, 11805, 11810, 11817, 11824, 11829, 11834, 11839, 11844, 11849, 11854, 11859, 11866, 11871, 11878, 11883, 11888, 11893, 11898, 11903, 11908, 11915, 11920, 11928, 11933, 11938, 11943, 11948, 11953, 11958, 11965, 11970, 11975, 11980, 11987, 11992, 11997, 12002, 12007, 12014, 12019, 12024, 12029, 12037, 12042, 12047, 12052, 12057, 12063, 12069, 12074, 12079, 12084, 12091, 12096, 12101, 12106, 12111, 12119, 12123, 12128, 12133, 12138, 12146, 12151, 12156, 12161, 12169, 12174, 12179, 12184, 12188, 12193, 12201, 12206, 12211, 12218, 12223, 12228, 12233, 12238, 12243, 12251, 12256, 12260, 12268, 12273, 12278, 12283, 12288, 12292, 12297, 12302, 12310, 12317, 12322, 12327, 12332, 12337] v1=[ 0.36 0.59 0.81 0.92 0.90 0.76 0.54 0.31 0.17 0.19 0.36 0.59 0.81 0.92 0.90 0.76 0.54 0.31 0.17 0.19 0.36 0.59 0.81 0.92 0.90 0.77 0.54 0.31 0.17 0.19 0.35 0.59 0.81 0.92 0.90 0.77 0.55 0.32 0.18 0.19 0.35 0.59 0.80 0.92 0.90 0.77 0.55 0.32 0.17 0.19 0.35 0.59 0.80 0.92 0.90 0.79 0.55 0.32 0.18 0.18 0.35 0.59 0.80 0.92 0.92 0.79 0.57 0.32 0.18 0.18 0.35 0.58 0.80 0.92 0.92 0.79 0.57 0.32 0.18 0.18 0.35 0.58 0.80 0.92 0.92 0.79 0.57 0.34 0.18 0.18 0.34 0.58 0.80 0.92 0.92 0.80 0.57 0.34 0.18 ] In order to make the non linear regression I added the toolbox which contains the nlinregr function and called it like this : fun='A*sin(W*t1+P)' dfun='[sin(W*t1+P), A*t1*cos(W*t1+P), A*cos(W*t1+P)]' [p, yhat,stat]=nlinregr([t1 v1], 't1 v1', fun, dfun,'A W P', 'v1') With 'fun' the sinewave function I'm trying to fit, 'dfun' the matrix made of the analytical derivative depending on my parameters A, W and P. While executing this function I'm getting the error "Incoherent Multiplication" but after 2 hours I'm still not able to point out where the problem is .... Can someone help me please ?
datafit is dedicated to such non-linear fitting. It's a native Scilab function. Code to perform the fitting and to show results: t1 = [11800, 11805, 11810, 11817, 11824, 11829, 11834, 11839, 11844, 11849, 11854, 11859, 11866, 11871, 11878, 11883, 11888, 11893, 11898, 11903, 11908, 11915, 11920, 11928, 11933, 11938, 11943, 11948, 11953, 11958, 11965, 11970, 11975, 11980, 11987, 11992, 11997, 12002, 12007, 12014, 12019, 12024, 12029, 12037, 12042, 12047, 12052, 12057, 12063, 12069, 12074, 12079, 12084, 12091, 12096, 12101, 12106, 12111, 12119, 12123, 12128, 12133, 12138, 12146, 12151, 12156, 12161, 12169, 12174, 12179, 12184, 12188, 12193, 12201, 12206, 12211, 12218, 12223, 12228, 12233, 12238, 12243, 12251, 12256, 12260, 12268, 12273, 12278, 12283, 12288, 12292, 12297, 12302, 12310, 12317, 12322, 12327, 12332, 12337]; v1 = [0.36 0.59 0.81 0.92 0.9 0.76 0.54 0.31 0.17 0.19 0.36 0.59 0.81 0.92 0.9 0.76 0.54 0.31 0.17 0.19 0.36 0.59 0.81 0.92 0.9 0.77 0.54 0.31 0.17 0.19 0.35 0.59 0.81 0.92 0.9 0.77 0.55 0.32 0.18 0.19 0.35 0.59 0.8 0.92 0.9 0.77 0.55 0.32 0.17 0.19 0.35 0.59 0.8 0.92 0.9 0.79 0.55 0.32 0.18 0.18 0.35 0.59 0.8 0.92 0.92 0.79 0.57 0.32 0.18 0.18 0.35 0.58 0.8 0.92 0.92 0.79 0.57 0.32 0.18 0.18 0.35 0.58 0.8 0.92 0.92 0.79 0.57 0.34 0.18 0.18 0.34 0.58 0.8 0.92 0.92 0.8 0.57 0.34 0.18]; function g = gap(p, Data) // v = p(1) + p(2)*sin(p(3)*t+p(4)) // p = [v_offset, amplitude, angular_frequency, phase] t = Data(1,:) v = Data(2,:) g = v - (p(1) + p(2)*sin(p(3)*t+p(4))) endfunction p0 = [0.50 0.35 2*%pi/50 0.5]; // initial guess of fitting parameters [p, dmin, status] = datafit(gap, [t1 ; v1], p0, "ar",200) vfit = p(1) + p(2)*sin(p(3)*t1+p(4)); clf subplot(2,1,1), plot(t1,v1), title "Given data" fontsize 3 subplot(2,1,2), plot(t1, vfit-v1), title "Fit - data" fontsize 3 Results: --> [p, dmin, status] = datafit(gap, [t1 ; v1], p0, "ar",200) p = 0.572807 0.3879044 0.114452 131.77806 offset amplitude angular phase frequency dmin = 0.0331676 average v distance between data and fit status = 9. means "OK"
How to modify the stroke width of this SVG spiral path?
I am trying to create a spiral path in svg as you can see in the code below but I want the stroke width starting as thicker and ending with a thinner one like this one here . Can someone help ? <html> <head> </head> <body> <svg id="mySVG" width="400" height="400"> <path id="Spiral" stroke-width="3" fill="none" stroke="maroon" d="M200 200 S 200.2 200 200.4 200.1 200.6 200.2 200.7 200.4 200.8 200.6 200.9 200.8 200.9 201.1 200.9 201.4 200.8 201.6 200.6 201.9 200.4 202.2 200.2 202.4 199.8 202.6 199.5 202.8 199.1 202.9 198.6 202.9 198.2 202.9 197.7 202.8 197.2 202.6 196.8 202.4 196.3 202 195.9 201.6 195.5 201.1 195.2 200.6 195 200 194.8 199.3 194.8 198.7 194.8 197.9 194.9 197.2 195.1 196.5 195.5 195.8 195.9 195.1 196.5 194.4 197.1 193.8 197.8 193.3 198.7 192.9 199.5 192.6 200.5 192.4 201.5 192.3 202.5 192.4 203.5 192.6 204.5 192.9 205.5 193.4 206.4 194 207.3 194.7 208.1 195.6 208.7 196.5 209.3 197.6 209.7 198.8 210 200 210.1 201.3 210.1 202.6 209.9 203.9 209.5 205.2 208.9 206.5 208.2 207.7 207.3 208.8 206.2 209.8 205 210.7 203.7 211.4 202.3 212 200.8 212.4 199.2 212.6 197.6 212.6 196 212.4 194.4 211.9 192.8 211.3 191.3 210.5 189.9 209.4 188.7 208.2 187.6 206.8 186.6 205.3 185.9 203.6 185.3 201.9 185 200 184.9 198.1 185.1 196.2 185.5 194.3 186.2 192.4 187.1 190.6 188.2 188.9 189.5 187.4 191.1 186 192.8 184.8 194.7 183.8 196.8 183.1 198.9 182.6 201.1 182.4 203.3 182.5 205.6 182.9 207.7 183.5 209.9 184.5 211.9 185.7 213.7 187.1 215.4 188.8 216.8 190.8 218 192.9 219 195.1 219.6 197.5 220 200 220 202.5 219.8 205.1 219.2 207.6 218.2 210 217 212.3 215.5 214.5 213.6 216.5 211.6 218.2 209.3 219.7 206.8 220.9 204.2 221.8 201.4 222.4 198.6 222.6 195.7 222.4 192.9 221.9 190.1 221 187.5 219.8 185 218.2 182.7 216.3 180.6 214.1 178.8 211.7 177.3 209 176.2 206.1 175.4 203.1 175 200 175 196.8 175.4 193.7 176.2 190.6 177.4 187.6 179 184.7 180.9 182.1 183.2 179.7 185.7 177.5 188.6 175.8 191.7 174.3 194.9 173.3 198.3 172.7 201.7 172.5 205.2 172.7 208.7 173.4 212 174.5 215.2 176 218.2 178 221 180.3 223.5 183 225.6 185.9 227.3 189.2 228.7 192.6 229.6 196.3 230 200 230 203.8 229.4 207.6 228.5 211.3 227 214.8 225.1 218.2 222.7 221.4 220 224.2 216.9 226.7 213.5 228.8 209.9 230.4 206 231.6 202 232.3 198 232.5 193.9 232.2 189.8 231.4 185.9 230 182.1 228.2 178.6 225.9 175.4 223.1 172.5 220 170 216.5 168 212.7 166.5 208.6 165.5 204.4 165 200 165.1 195.6 165.7 191.2 166.9 186.9 168.6 182.8 170.9 178.8 173.6 175.2 176.8 172 180.4 169.1 184.3 166.7 188.6 164.8 193 163.5 197.7 162.7 202.4 162.5 207.1 162.9 211.7 163.9 216.3 165.4 220.6 167.6 224.6 170.3 228.3 173.4 231.6 177.1 234.4 181.1 236.6 185.5 238.4 190.2 239.5 195 240 200 239.9 205 239.1 210 237.7 214.9 235.8 219.7 233.2 224.1 230 228.2 226.4 231.9 222.3 235.1 217.8 237.8 213 239.9 207.9 241.5 202.7 242.3 197.3 242.5 192 242 186.7 240.9 181.6 239.1 176.7 236.6 172.2 233.6 168.1 230 164.4 225.9 161.3 221.3 158.7 216.3 156.8 211.1 155.6 205.6 155 200 155.2 194.3 156 188.7 157.6 183.2 159.9 177.9 162.8 173 166.3 168.4 170.4 164.2 175 160.7 180.1 157.7 185.5 155.3 191.2 153.6 197 152.7 203 152.5 209 153 214.8 154.3 220.5 156.4 225.9 159.1 231 162.6 235.6 166.6 239.6 171.2 243.1 176.3 245.9 181.8 248 187.7 249.4 193.8 250 200 249.8 206.3 248.8 212.5 247 218.6 244.5 224.5 241.3 230 237.3 235 232.8 239.6 227.6 243.6 222.1 246.9 216.1 249.5 209.8 251.3 203.3 252.3 196.7 252.5 190.1 251.9 183.6 250.4 177.3 248.1 171.4 245.1 165.8 241.3 160.8 236.8 156.3 231.7 152.5 226.1 149.4 220 147.1 213.6 145.6 206.9 145 200 145.2 193.1 146.3 186.2 148.3 179.5 151.1 173.1 154.7 167.1 159 161.5 164 156.5 169.7 152.2 175.8 148.6 182.4 145.8 189.3 143.8 196.4 142.7 203.6 142.5 210.8 143.2 217.9 144.8 224.8 147.3 231.3 150.7 237.4 154.8 242.9 159.7 247.7 165.3 251.9 171.5 255.2 178.1 257.7 185.2 259.3 192.5 260 200 259.7 207.5 258.5 215 256.3 222.3 253.3 229.3 249.4 235.9 244.6 241.9 239.1 247.3 233 252 226.3 255.9 219.2 259 211.7 261.1 203.9 262.3 196.1 262.5 188.2 261.7 180.5 259.9 173.1 257.2 166 253.5 159.5 249 153.5 243.7 148.2 237.6 143.7 230.9 140.1 223.7 137.4 216.1 135.7 208.1 135 200 135.3 191.8 136.7 183.7 139 175.9 142.3 168.3 146.6 161.2 151.7 154.7 157.7 148.8 164.3 143.8 171.6 139.6 179.3 136.3 187.4 134 195.8 132.7 204.2 132.5 212.7 133.4 221 135.3 229 138.3 236.7 142.2 243.7 147.1 250.2 152.9 255.8 159.4 260.6 166.7 264.5 174.5 267.4 182.7 269.2 191.3 270 200 269.6 208.8 268.2 217.5 265.6 226 262 234.1 257.4 241.7 251.9 248.7 245.5 255 238.4 260.5 230.6 265 222.2 268.5 213.5 270.9 204.5 272.3 195.4 272.5 186.4 271.5 177.4 269.4 168.8 266.2 160.7 262 153.1 256.7 146.2 250.5 140.1 243.5 135 235.7 130.8 227.4 127.7 218.6 125.8 209.4 125 200 125.4 190.6 127 181.2 129.7 172.2 133.6 163.5 138.5 155.3 144.5 147.8 151.3 141.1 159 135.3 167.3 130.5 176.2 126.8 185.5 124.2 195.1 122.8 204.9 122.6 214.6 123.6 224.1 125.8 233.3 129.2 242 133.8 250.1 139.4 257.4 146.1 263.9 153.6 269.4 161.8 273.8 170.8 277.1 180.2 279.2 190 280 200 279.6 210.1 277.9 220 274.9 229.7 270.8 238.9 265.5 247.6 259.2 255.6 251.9 262.7 243.7 268.9 234.8 274 225.3 278 215.4 280.7 205.2 282.2 194.8 282.4 184.5 281.3 174.4 278.9 164.6 275.3 155.3 270.4 146.7 264.4 138.9 257.4 132 249.4 126.2 240.6 121.5 231.1 118.1 221 115.9 210.6 115 200 115.5 189.3 117.3 178.8 120.4 168.5 124.8 158.7 130.4 149.5 137.2 141 144.9 133.4 153.6 126.9 163 121.5 173.1 117.3 183.7 114.3 194.5 112.8 205.5 112.6 216.5 113.8 227.2 116.3 237.6 120.2 247.4 125.4 256.5 131.7 264.7 139.2 272 147.7 278.2 157 283.1 167.1 286.8 177.7 289.1 188.7 290 200 289.5 211.3 287.6 222.5 284.2 233.4 279.6 243.7 273.6 253.5 266.5 262.4 258.3 270.4 249.1 277.3 239.1 283.1 228.4 287.5 217.3 290.6 205.8 292.2 194.2 292.4 182.6 291.2 171.3 288.4 160.3 284.3 150 278.9 140.3 272.1 131.6 264.2 124 255.3 117.5 245.4 112.2 234.8 108.4 223.5 105.9 211.9 105 200 105.6 188.1 107.6 176.3 111.1 164.8 116 153.8 122.3 143.6 129.9 134.1 138.6 125.7 148.2 118.4 158.8 112.4 170 107.7 181.8 104.5 193.9 102.8 206.1 102.6 218.3 103.9 230.3 106.8 241.8 111.1 252.7 116.9 262.9 124 272 132.4 280.1 141.8 286.9 152.2 292.4 163.4 296.5 175.2 299 187.5 299 187.5 "></path> </svg> </body> </html>
SVG paths can't have variable width strokes. You would need to either: Don't use strokes. Instead use a filled path that spirals in and gets narrower as it does, or Use a sequence of lines or paths that line up with one another. Each successive path would have a slighlty narrower stroke-width. Giving the illusion of a continuous path with a narrowing width. Like the followong example: <svg stroke="black"> <path d="M 0,75 L 50,75" stroke-width="10"/> <path d="M 50,75 L 100,75" stroke-width="9"/> <path d="M 100,75 L 150,75" stroke-width="8"/> <path d="M 150,75 L 200,75" stroke-width="7"/> <path d="M 200,75 L 250,75" stroke-width="6"/> <path d="M 250,75 L 300,75" stroke-width="5"/> </svg>
How to point cities in a SVG map?
How can I pointing cities in a svg map like this: http://incassobond.nl/arnhem-incassoburau-inschakelen-no-cure-no-pay.htm Below is my code which is a map of the Netherlands .lw { font-size: 60px; } <head> <style> svg { height: 50vw; } path{ fill: #d3d3d3; transition: .6s fill; } path:hover { fill: #eee } </style> <meta charset="utf-8"> <title>Naamloos document</title> </head> <body> <svg id="svg3805" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="204.22mm" width="172.94mm" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" viewBox="0 0 612.78192 723.61818"> <g id="layer1" transform="translate(-56.466 -190.55)" stroke="#fff" stroke-width=".5" fill="#ccc"> <path id="NL-DR" d="m524.64 314.38 4.33 1.6 2.01-5.29 1.17-0.36 0.37-3.37 2.69-8.21 3.38-3.69 0.49-2.55 5.03-2.74 1.4-1.34 0.09-0.93 5.35-1.39 2.75-0.32 5.4 1.93 1 2.58 0.6 0.02 2.34 4.09 1.14 3.18 2.39-0.81 1.18 4.1h1.32l3.54 3.11 1.06 2.92 1.74 2.13 0.04 1.81 9.25-3.71 6.57 0.35 1.25 0.84 29.78 31.93 12.71 18.61 1.53 1.33 3.34 0.89-4.49 10.91 3.76 0.4 0.49 1.85 0.59-0.05 2.34 3.43 1.03 1.04 1.25-0.13-0.54 2.72 3.18-0.16-3.31 7.5-2.65 43.5-2.2 2.6-4.7-1.17-1.22-1.17-1.92 0.13-2.7-1.38-3.39 2.08-2.67 0.26-2.95-0.88-0.45-1.59-2.93-1.01-2.5 0.26-1.13-0.94-1.69 1.04-1.8 0.18-2.35-0.88-2.27 1.14-5.89-1.3-2.09 0.73-0.52 0.83-1.44-0.52-2.6 0.78-4.87 5.05-1.82-0.11 1.52-5.74-15.03-6.46-10.1 2.27-6.03 4.63 0.94 9.78-2.22-2.08-4.49-0.32-1.51-1.69-1.12 2.47-2.67 0.37-1.48-1.28-0.55-2.02-1.96 2.47-1.43-0.73-0.5 0.91-1.51-0.05-1.82 1.43-1.34-1.56-0.4-2.71-1.78-3.82-5.84-4.22 0.38-1.69-0.54-0.93-4.12 1.06-1.1 0.91-1.43-1.58-1.71 0.88-1.34-1.25-1.13-0.08-1.77-2.11-2.69-0.72-1.59-1.49-2.11 0.5-0.85 1.17-2.41-0.68-1.22 0.5-3-3.57-5.8-14.96 1.06-1.49 6.71-2.42 0.19-1.26 5.16-5.71-10.77-12.33-2.35-3.63 13.31-9.42 4.21-5.86 3.89-3.74 7.5 0.55 4.97 5.1 9.37-6.7 5.52-10.45-10.35-16.08 0.69-8.93-9.44-3.57z" title="Drenthe" class="land"/> <path id="NL-FL" d="m383.88 462.08-0.68-0.75 2.77-7.32 3.85-2.49 0.3-1.12-1.82-5.61-8.78-14.14 0.36-0.26 8.85 14.14 1.87 6.05-0.4 1.27-3.91 2.44-2.1 5.11-0.31 2.68zm45.04-80.51 1.58 0.31 1.25 1.23 1.08-0.44-0.98-2.95 3.17 0.97 5.73 5.8 0.98 3.79 0.59-0.34 3.58 4.88h2.9l3.59 1.25 10.22 8.35 3.29 9.31 1.11 0.57 2.06 3.75-0.38 1.59-2.88 2.16-1.79 2.03 0.06 0.89 5.81 1.59 2.52 2.21 2.58 0.7 2.28 2.52-0.79 1.35-3.56 2.37-5.24 1.14-3.88 2.63-2.34 0.29-2.06-1.35-9.32 2.05-1.25 1.04-9.38-0.03-0.06 6.86 5.19 0.21 6.74 7.19 1.74 8.62-3.47 12-1.85 0.16-2.21 4.22 0.85 1.61-2.07 3.55-3.08 3.03-7.85 6.37-1.35-0.49 0.17 0.85-2.33 2.12-3.07 1.99-2.96 0.41-4.32 3.7-1.33-0.98-5 2.74-1.27-0.98-2.69 0.88-1.85 2.87-6.88 19.91-19.92 5.93-11.11-10.58-3.81-3.77-4.65-3.07-9.73-2.45-11 1.88-2.23-2.07 1.03-1.68-2.12-1.4 0.66-1.24-0.27-5.01-1.63-3.1 0.03-1.53 5.41-3.26 0.81-1.86 7.18-4.24 2.59-0.44 1.46-2.04 23.64-16.37 2.58-0.8 6.12-5.5 0.3-0.99-0.6-2.1-0.98 0.21 0.14-1.38 0.74 0.23 1.66-1.3 2.44-4.62 5.48-0.57 5.36-5.12-0.48-0.96 0.55-0.55 0.52 0.86 4.48-4.6 10.59-3.07 3.51-2.89-5-8.06-2.83-2.08 0.52-0.44-0.74-0.96-1 0.18 0.27-26.71 10.57-17.2 7.88-1.78z" title="Flevoland" class="land"/> <path id="NL-FR" d="m374.77 318.92 2.55 1.68 1.38 3.55-3.05-0.21-1.38-2.44-0.35-2.34 0.85-0.24zm-5.56 0.16 0.06 1.1-5.74 1.26-12.99 11.45-0.08 0.68-1.66 0.79 1.41-0.03-1.58 0.21-5.62 4.88-0.65-0.87 5.51-4.83-0.09-0.58 0.73-0.39-0.49 0.84 14.79-13.05 4.78-1.66 1.62 0.2zm-41.49-61.5 4.19 0.79 0.41 1.32-1.22 1.14-0.71-0.32 0.3 0.55-1.91-0.32-2.36 0.66-3.17 2.59-11.3 4.67 0.74 3.11-1.47 0.87 0.05 2.56-3.86 1.58-2.15 2.32-4.45 0.53-2.9 1.58-1.31-0.37-0.76-2.24 8.96-5.67 7.12-7.1 9.3-6.34 6.5-1.91zm11.13 4.6-2.01 1.93-1.96-0.05 0.92-0.98-1.09-0.95 4.04-4.12 1.49-0.4 0.36 1.74-1.75 2.83zm166.05-31.73-3.69 5.38 0.93 5.74 1.68 1.8 5.9 1.8 1.72 3.41 2.96-1.43 5.52 1.9-0.84 7.32 1.96 1.22-2.31 1.58-1.23 3.38-1.47-0.19-1.17 0.69 0.17 5.52-0.82 0.4-0.71-0.5-1.28 2.74-0.96 0.37 0.46 0.66-0.81 0.98 0.16 2.03-2.74 0.45 2.67 4.88-0.21 1.18-1.49 2.79-1.6 1.74-1.42 0.42-0.22 1.4-3.32 5.58-0.7 9.42 4.83 5.29 5.21 0.79 4.37-0.18 2.31 1.24 2.09 2.6 3.8 1.52-1.28 3.52 9.43 3.57-0.68 8.93 10.35 16.08-5.52 10.45-9.37 6.7-4.97-5.1-7.5-0.55-3.89 3.74-4.21 5.86-13.31 9.41-6.11 4.02-2.77-0.1-1.79 0.73 0.21 3.19-3.73 2.01-0.71-1.44-4.13 1.12-2.09-0.99-2.15-5.38-2.83 0.94-0.02 1.38-1.47-0.6-2.41 0.52-0.71 0.86 0.02 2.04-4.21 3.97-3.31 1.57-5.87-1.57-1 0.57-0.35-1.07-2.17-1.49-3.78 2.64-0.59 0.34-0.98-3.79-5.73-5.8-3.17-0.97 0.98 2.95-1.08 0.44-1.25-1.23-1.58-0.31 0.11-1.12-1.46 0.57-0.7-1.49-3.99-0.21 0.11-0.99-0.92 1.7-1.68-0.29-0.73-0.84 0.3-2.09-1.77-1.31-4.23 2.46-2.21-0.31-2.83 0.65-1.06 2.77-4.15 1.57-14.86-5.7-5.43 1.65-4.35-2.2-4.46-4.1-2.5-3.64 2.79-3.4 4.53-2.12 0.87-1.23 0.16-2.67-0.84-4.14-0.87-1.05 1.79-0.86-0.6-0.42 1.08 0.03 0.43-1.96-0.55-1.39-0.76 0.03 1.17-0.29 0.16-1.21-1.72-5.4-0.57-4.43 1.38-2.33 0.05-2.7-1.39-0.39-0.25-1.44 0.73-0.29 0.11-1.1 0.43 0.31-0.21-3.94-0.55 3.81-0.6 0.42-1.09-2.52-1.55-1.71-0.25-1.55 1.22-0.21 0.82 0.71v-0.68l0.67-0.05 0.49 0.79 0.73-0.1-1.77-3.44-0.3-3.13-1.71-3.26-5.93 4.89-0.92-1.52 2.07-0.74 4.42-4.28 0.51-3.44 2.56-1.55 1.35-1.76 1.83-11.34-0.05-1.11-1.06-1.05 1.9-1.76 2.6-7.96 1.61-2.58 5.49-5.64 7.14-4.46 4.42-4.54 0.96-2.69 4.4-4.44 4.46-2.3 11.87-3.73 11.6-7.03 16.19-7.46 3.31-1.91-1.6-2.7 0.44 0.61 0.35-0.37 0.98 2.28 4.56-0.03 8.61-2.97 0.43 0.45 2.36-0.42 4.21-1.35 8.36-1.09 2.55 0.69 0.28-0.69 0.32 0.69 0.67-1.03 6.95 1.46 6.28-2.97 1.06-0.08 1.22 1.07zm-105.26-9.44-2.01 0.48 5.13-0.19-0.11 2.54-3.18 1.62-2.07-0.13-4.62 2.86-2.31-0.98 0.29 2.25-3.67-1.46 2.03 1.93 2.45 0.93-1.2 0.16-0.49 0.95-10.11 0.26-2.47 0.64-6.12 4.87-3.29 1.51-1.87-0.69-0.38 0.74-1.85 0.49-0.6 1.27-5.85-0.58-2.47 2.17-0.74-0.56-2.61 0.32-0.66 0.9 0.09 1.9-1.8-0.4-3.45 3.31-1.87-0.45-2.66-1.93-0.44-3.28 3.4-3.33 2.18-3.89 0.28 0.77 0.66-2.22 19.88-3.89 1.25 0.27 15.4-5.01 13.39-5.46 3.12-0.58 2.71 0.53-0.33 0.95-3.03 0.41zm84.71-3.36 0.27 2.12-0.4-0.69-2.17 1.86-0.87-0.42-0.33-1.48 0.92-1.35 2.58-0.04zm-53.55-0.06 19.15-1.56 19.37 0.05 1.74 0.85-0.9 0.95-1.6 0.34-8.45-0.21-2.96 1.64-13.34 3.66-4.64-0.03-0.41 1.27-0.02-1.7-7.67-0.82-3.31 3.31-5.71 1.54-0.49 1.25-5.44-2.83-2.59-3.6 0.63-4.93 2.39-2.09 10.44 2.63 3.81 0.28zm67.63-13.05 1.42 0.27 1.55 1.46 4.51 0.48 18.02-2.2 5.78-0.24 0.29 0.45-2.77 1.96-8.67 3-1.06 1.33-3.96 1.86-7.82 1.14 0.74 1.25-1.12-1.11h-4.23l-0.32 1.06-0.16-1.01-1.08 0.21-0.71 0.88 0.41 0.56-1.77 0.16 0.57 2.02-3.21-0.27-1.65 1.59-0.68-0.48 0.66-3.34 1.66-4.03 1.42-2.07 3.88-3.08-6.19-1.75-1.17 2.97-1.03-0.16 0.11-0.96 1.09-2.52 5.49 0.57z" title="Friesland" class="land"/> <path id="NL-GE" d="m453.03 464.1 2.15-0.8 2.46 2.18 3.21 4.51 2.15 5.11 1.2-0.55 0.62 0.57 2.94-1.73 1.37 1.97 6.89-7.13 1.71-0.6 1.11-1.32 4.64 3.01 1.82 3.68 3.65 2.1 1.35 1.63 0.46 6.53 4.21 5.2 0.99 3.55-1.97 7.96-3.31 1.58-3.14 0.6-0.63 0.87 0.26 1.53 2.34 1.55-2.87 1.89-0.01 5.14-0.91 3.12 1.57 0.21 0.63 4 2.71 0.36 0.33 0.6 1.27 2.6 0.13 2.5 2.84 4.6-0.91 2.32 2.69 1.05 1.96-0.18-0.19 1.42-1.44 1.57 0.43 1.65 2.42 1.11 0.72 1.88 0.32-0.77-0.87-1.52 0.62 0.26 0.16-1.16 0.72 0.77 0.59-2.53 4.13 0.03 2.31 1.73 5.05 1.05 3.62 0.26 0.08-0.75 1.04 0.36 2.2-1 1.21 1.39 3.27 0.03 2.66-0.42 0.09-2.19 2-1.49 4.75-0.93 5.52 0.62-0.05 1.29 1.76 3.43 3.19 3.34 1.3 2.63 2.3 0.72 0.94 3.38 2.58 1.95 3.56-0.9 6.29 1.03 5.8-1.42 2.52 2.22-0.4 1.47 1.33 1.23 2.65-2.37 1.61 1.34 0.78-1.36 0.66 0.05 3.26 1.72 0.73 1.26-0.54 1.37 0.41 4.01-1.68 2.7 8.49 2.98 7.13-0.05-0.68 5.32-0.55 0.87-0.54-0.51-0.92 0.87 0.92 2.11-1.96 2.44-6.73 1.13 0.26 1.44-1.6 3.31 0.22 3.28h4.32l6.15 2.95 2.06 2.42 6.46 4.84 0.3 1.28 2.86 0.44 0.57 6.59-0.46 0.81-2.1 0.08-2.44 1.33-0.41 5.46-3.81 5.17-2.9 1.2-0.35 1.23-2.34 0.82-0.76 1.4-1.49 0.72-2.62-2.07-1.89-2.87-2.32-0.25-6.3 2.99-1.01 1.05-1.35-0.23-7.32 2.45-3.07 2.43-1.16-0.92-1.2 0.49-6.03 4.06-1.16 2.13-4.57 1.66-3.15-3.05-2.8 1.67-0.79-1.84-5.54-2.15-0.73 2.91 3.68 2.66-1.21 1.69 0.7 2.45-0.68 0.02 0.52 1.77-0.65 0.58-2.66-1.76-3.46-0.53-0.38-2.2-1.14-1.02-7.64-0.34-1.03-4.67-3.04-1.46-1.2-0.18-2.66 1.59-6.92-0.11-4.17-3.42-0.11-1.02 1.21-0.23-0.34-1-3.39-2.58-0.21 0.48-1.88-1.18-3.61 0.62-1.07 0.82-1.17-0.92-2.12 2.43 2.45 0.05 2.78 1.71 0.97 3.84 3.08 2.48 0.29 5.05-5.76-1.73-4.76-0.36-5.59-3.99-0.87 1.61-1.03 0.44 0.22 1.4-3.21 2.28-0.52-0.54-1.87 0.69-0.81 1.61-1.86 0.94-2.3 0.26-4-1.48-2.56 3.17 2.1 1.63-0.51 0.66-1.26-0.3-0.19 0.84 2.69 1.45 2.21 2.3-0.74 2.27 0.51 1.05 2.35 0.56-1.04 1.05-0.17 1.35 1.09 1.25-0.08 0.74-5.37 3.75-0.34 1.7-2.93 0.79-1.35-1.73-1.8-0.56-0.52-2.86-2.99-3.82-4.28 0.25 0.8 3.73-0.89 0.94-2.37-0.43-10.97 1.78-3.4-0.25-2.23-1.43-2.28-3.44-3.75-0.92-3.09-3.83-2.96-0.51-1.69-1.07-3.07-5.54-2.79-0.18-5.56-2.58-4.72 0.59-1.88 2.55-1.02 0.31-3.29-0.82-2.43-2.42-1.57-0.51-1.54 0.66-1.48 3.52-2.85 1.1-3.23-0.05-1.58-0.66-1.96-2.4-1.3 0.02-5.9 8.91-1.74 7.68-8.98 5.07-4.62-0.87-3.35 1.74-4.84-2.5-3.72 0.81-5.19-0.68-5.59 1.42-0.06-1.86 2.53-2.57-1.03-1.3 0.43-3.11-3.61-1.76-2.39-2.07-1.88 0.25-1.54 1.64-1.69-0.08-3.23-4.64-4.24-1.94-3-3.81 2.37 0.05 1.03-4.98-3.4-0.46-0.95-1.58 0.34-1.41-0.58-1.86 0.41-0.43 1.8 1.58 4.01-0.1 1.53 0.61 2.9-1.86-1.09-0.67-0.15-1.74 4.32-1.28 1.67-3.17 3.67 0.44 0.65-2.87 2.19-4.06 0.75 0.35-0.1-1.61 6.93-12.39 2.17 1.41 2.88 0.23 3.2-4.53 1.2-0.31 4.86 3.61 4.57 0.87 2.45 1.64 1.35 0.08 1.93-0.98 2.82-2.89 5.15 0.18 4.97-1.9 3.12-2.33 4.32 0.85 3.7-0.08 3.2 2.26 5.11 1.89 2.28 2.72 5.33 1.58 2.68 1.8 1.59-1.41 0.91 0.51-0.07-1.31 0.94-0.23-0.71-3.89 0.58-1.72-1.6-1.89-1.03-3.16-2.26-1.38-1.06-2.77-2.42-1.82 0.87-0.02 0.21-4.49-3.01-1.13 0.21-1.77-1.21-0.52 1.24-7.54-0.26-2.01-0.96-0.64-0.13-1.85-0.6-0.41 0.03-2.19-1.33 0.72-0.41-0.48-1.41 0.36 1.33 3.44-0.11 0.51-1.28-0.38-0.51 0.9 1.05 0.43-1.52 1.62-2.72-0.18-0.41 1.39-3.2 0.49-3.75-2.6 1.71-2.18 2.28-1.44-0.21-2.67 1.46-1.83-1.11-0.72 3.27 0.34-0.63-1.6-1.5-1.15 0.58-1.37 1.73-0.25 0.77-1.49-2.13-1.06 0.19-1.88-2.91-0.61 0.22-1.73-1.46-1.52-8.56-1.72-0.65-2.99 2.52-0.72 0.36-3.5-6.47-5.28 1.82-7.83 19.92-5.93 6.89-19.91 1.85-2.87 2.69-0.88 1.26 0.99 5-2.74 1.33 0.98 4.32-3.7 2.96-0.41 3.07-1.99 2.33-2.12-0.18-0.86 1.35 0.49 7.85-6.36 3.08-3.03 2.08-3.55-0.86-1.61 2.22-4.22 1.85-0.15z" title="Gelderland" class="land"/> <path id="NL-GR" d="m599.67 218.2 1.39 0.34 2.55-2.07 2.75 1.11 0.33 0.93-0.4 1.3-2.75-0.56-0.11 0.5 2.47 0.61-0.17 0.72-1.44 0.19 4.35 0.69 0.11-0.53-1.54-0.53 0.67-2.54 3.1 0.98 3.5 3.34-1.33 4.77-0.17 3.71 2.29 3.31-0.43 0.69 0.78 0.71-0.21 2.78 1.74 7.91 5.67 4.1-0.93 1.85 10.13 3.81 2.22 1.66 6.06 1.69 4.68-0.11 0.66-0.95 2.82-1 0.03 0.69-2.33 2.14-0.05 4.23-1.27 3.51 1.19 2.56 2.45 1.66 5.47 0.4 1.61 1.19 1.87 0.5 1.09-0.42 1.47 1.11 5.41 1.66 0.55-2.03 1.34 11.63-1.49 2.61 2.96 2.74-3.78 1.16-2.15 4.69-0.06 2.53-1.55 2.21 0.63 4.39 2.85 2.1-0.33 8.75 2.06 17.36 0.81 2.07-1.28 1.6-4.16 15.26-12.14 20.13-2.63 3.37-0.35 0.76 0.79 2.95-3.18 0.16 0.54-2.72-1.25 0.13-1.03-1.05-2.34-3.42-0.59 0.05-0.49-1.86-3.77-0.39 4.49-10.91-3.34-0.89-1.54-1.33-12.71-18.6-29.78-31.94-1.25-0.84-6.57-0.34-9.26 3.71-0.03-1.81-1.74-2.13-1.06-2.92-3.54-3.1h-1.31l-1.19-4.11-2.39 0.82-1.14-3.19-2.34-4.08-0.6-0.03-1-2.58-5.4-1.92-2.75 0.32-5.35 1.4-0.09 0.92-1.39 1.34-5.03 2.74-0.49 2.55-3.39 3.69-2.69 8.21-0.36 3.37-1.17 0.37-2.01 5.28-4.34-1.6-3.8-1.52-2.09-2.6-2.31-1.24-4.37 0.18-5.21-0.79-4.83-5.29 0.7-9.42 3.32-5.58 0.22-1.4 1.42-0.42 1.6-1.74 1.49-2.79 0.22-1.19-2.67-4.88 2.74-0.45-0.16-2.03 0.81-0.98-0.46-0.66 0.96-0.37 1.28-2.74 0.71 0.5 0.82-0.4-0.17-5.52 1.17-0.69 1.47 0.19 1.23-3.38 2.31-1.58-1.96-1.22 0.84-7.32-5.52-1.9-2.96 1.43-1.72-3.41-5.9-1.8-1.68-1.8-0.93-5.74 3.69-5.38 1.39-0.4 0.05 1.01 0.63 0.03 7.55-1.88 6.52 3.31 2.36 2.52 4.1-3.04 9.29-3.92 26.32-3.36 21.9-8.03 8.85-0.88 5.85 2.35zm-60.67-16.76 0.74 0.13-0.08 0.66-4.07-0.61 1.17-0.53 2.24 0.35zm28.25-1.54 1.11 0.19-0.66 1.25-2.55-1.35 1.2-0.56 0.9 0.47zm4.7-4.52-0.11 0.53-2.23-0.29 0.79 1.94-3.24-1.54-2.56 0.24-0.38-0.5 1-1.54 1.01-0.29 3.42 0.37 2.3 1.08zm-19.48-0.64 2.56 0.58 2.67 2.63-3.21-0.48-1.01-0.98-0.33 2.07-2.36-0.26-0.85 0.58 0.49 1.27-0.78 0.53-1.39-0.4-0.71-0.58-0.35-2.1-2.52-2.31 0.78-4.46 0.6 0.08 0.68 2.31 5.73 1.52z" title="Groningen" class="land"/> <path id="NL-LI" d="m453.35 660.12 0.89-0.94-0.8-3.73 4.28-0.25 2.99 3.82 0.52 2.86 1.8 0.56 1.35 1.73 2.93-0.79 0.28 1.43 6.03 0.15 5.16 2.76 1.42 2.14 1.43 0.51-0.21 1.14h-1.61l-0.98 1.22 1.01 3.21-0.71 1.81 0.65 3.54 7.37 3.36 0.95-0.33 0.36 0.71 4.64 0.81-1.79 6.21-1.2 2.87-0.6-0.28-0.43 4.02 4.75 3.71 0.99 1.9 4.28 4.14 3.73 7.42 3.39 2.66 2.26 3.96-0.03 5.29 1.61 4.95-0.69 6.35-0.83 0.36-0.06 4.58-1.19 6.96 3.14-0.15-1.87 3.49 1.87 6.45-5.62 5.18 0.39 1.49-3.83 0.83-2.29 6.24-3.94 5.45-1 2.93-6.01 6.63-2.1 1.29 2.24 4.78-2.85 1.04 1 9.22 1.41 2.74 2.69 0.4 3.61-2.82 6.77-3.27 2.63 2.04-6.7 3.32 5.57 3.8-1.94 1.34-0.08 1.05-5.41 0.81-3.39 2.21-2.41 0.43-0.88 2.69-0.82-0.48-1.22 1.81-2.47 1.03-0.21 1.28-1.96 2.27-1.83 1.4-1.76 0.53-0.7-0.43-0.95 0.71-2.5 2.39-0.95 1.9-1.47 0.53 0.26 0.81-1.71 2.08-0.32 4.07-1.77 0.82 0.3 1.41-3.53 0.15-3.66-7.83-3.52 3.26-4.18 0.58 0.28 1.56 1.89 2.31-0.89 1.75 1.01 2.56 2.61 1.96-0.04 1.48 1.47 0.65-0.22 3.56-1.63 1.81 0.74 1.45 1.14 0.07 4.6-2.65 3.12-0.7 2.12 2.23 2.3-0.98 6.86-0.23-1.58 5.12-1.57 1.55 1.82 1.13 0.46 4.61 4.18 1.5 0.85-0.3 0.69 0.65-0.18 1.23 3.23-0.23 2.25 1.4 0.93-1.02-2.04 3.05-1.08 4.1 2.2 4.93-1.9 3.28-0.47 3.37-2.58-1.3-0.32-1.05-5.82 2.53-0.11 3.47 1.61 3-0.84 0.45 0.27 0.77-2.69 3.02-0.76 0.2-2.96-1.87-1.56 1.82-0.13 1.5 2.03 0.6 1.88 2.37 4.4 2.7-1.57 2.92 0.68 1.62-6.28 0.42-1.36-1.92-1.69-0.4-7.05 2.95-0.44-1.1-1.36 0.15-0.7 0.85-1.93-1.4-0.58-3.09-3.77 1.94-1.66 1.72-0.96-2.49-2.09 1.35-3.67 0.77-2.58-3.64-1.38 0.57-1.34-3.54-1.59 0.27-4.08 5.29h-1.8l-1.33-0.92-0.84 1.05-2.66 1.14-2.36-0.64 2.9-6.07-1.44-3.47 1.04-2.47-0.9-1.42-2.12-0.18-0.25-1-3.48-0.92-0.13-1.15-1.01-0.58 0.3-1.32-1.74-3.37 0.2-4.53 1.14-0.97-0.6-0.75 0.41-0.55 3.58-1.9h1.33l0.57-1.68 1.94-2.05 0.84-3.61 1.2-0.25 1.65 0.95 0.82-0.42 0.95-4.16 1.9-2.4 0.89-2.8 1.72-0.86-0.99-2.43-1.11-0.2-2.47 1.41-1.08-0.58-0.14-1.28 7.17-8.9 0.01-3.03 1.56-3.34-2.87-2.68 2.12-4.29 0.37-2.87 2.78 1.01 1.35-0.71-0.53-2.83 1.32-1.76-1.47-2.97 2.13-1.2 2.33 0.93 1.25-1.36 0.22-1.43-0.65-0.96-3.13-0.75 0.03-1.89 2.25-2.76 2.64-0.53 0.73-2.29 1.55-1.08-2.95-2.29 0.21-0.88-2.06-2.82-1.6 2.19-1.53-0.86-4.27 2.72-0.38-0.93 0.63-1.81-1.25-0.53-0.17-0.75 1.17-0.99-0.78-0.17 0.4-1.36-1.47-1.51-3.36-1.21-0.77 0.88-3.47 0.18-1.23 0.95-3.18-1.1-1.95 0.57-0.82-0.75-2.12 0.12-1-1.61-0.03-1.58-13.9-5.87 4.62-1.41-0.03 0.55 4.02-2.02 0.97-10.51 7.04-10.02 32.14-10.03 9.29-7.96-9.59-16.35-1.86-10.57-1.21-3.09-2.33-16.06 8.4 1.65 2.66 2.11 5.21-0.54 10.41-3.85 3.89 3.98 0.92-0.89 1.63-0.15-1.14-2.18-0.02-4.27-2.13-3.61-0.63-5.82-3.98-3.89-3.94-2.64-0.25-1.27 1.23-3.59-3.3-1.04 1.18-2.8-1.44-7.46-2.89-1.53-4.38-0.59-2.65-1.07-1.1-1.4-1.07-5.66z" title="Limburg" class="land"/> <path id="NL-NB" d="m316.7 643.94 3.01 3.8 4.24 1.94 3.23 4.64 1.69 0.08 1.54-1.63 1.88-0.25 2.39 2.07 3.61 1.76-0.43 3.11 1.03 1.3-2.53 2.57 0.06 1.86 5.59-1.43 5.19 0.69 3.72-0.82 4.84 2.5 3.35-1.73 4.62 0.87 8.97-5.07 1.74-7.68 5.9-8.91 1.3-0.03 1.96 2.4 1.58 0.66 3.23 0.05 2.85-1.1 1.49-3.52 1.54-0.66 1.57 0.51 2.44 2.43 3.29 0.82 1.01-0.31 1.88-2.55 4.72-0.59 5.57 2.58 2.79 0.18 3.07 5.54 1.69 1.07 2.96 0.51 3.08 3.83 3.75 0.92 2.28 3.44 2.23 1.43 3.4 0.26 10.97-1.79 2.37 0.43 2.03 1.91 1.06 5.66 1.11 1.4 2.64 1.07 4.38 0.59 2.9 1.53 1.44 7.46-1.19 2.8 3.31 1.04-1.23 3.59 0.25 1.27 3.94 2.64 3.97 3.89 0.63 5.82 2.14 3.61 0.02 4.27 1.14 2.18-1.63 0.15-0.92 0.89-3.89-3.99-10.41 3.86-5.21 0.53-2.66-2.11-8.4-1.65 2.33 16.06 1.22 3.09 1.85 10.57 9.59 16.35-9.29 7.96-32.14 10.03-7.04 10.02-0.96 10.52-4.02 2.02 0.03-0.55-4.62 1.41-0.6-0.53-0.71-4.92 0.14-5.77-4.62-4.31-1.76-3.08-4.05-1.14-0.95-0.08-2.86 3.79-3.85 0.73-0.49 1.49-0.89 0.1-2.6 3.46-11.31-3.03-1.57 3.08-6.73 0.35-4.78-1.21-4.41 1.01-1.44-1.39 2.14-9.51-6.19-4.01-4.13 1.36-1.77 1.39-4.46-1.36-0.41-8.26-9.53-11.53 5.16-9.84-4.15-9.83-5.22-0.33-1.12-1.93 0.08-1.67-0.71-0.3-3.99 3.85-0.9 6.89-6.22 5.27-5.55 6.98-0.54-0.83 0.3 0.99-1.01 0.46-1.14-0.33 1.6-0.43-2.14-1.47-1.57-2.83-0.93 0.56-1.28-0.86 0.19-0.61-0.6 0.48-1.38-0.35-1.41 1.95-2.52-1.49-0.81 0.68-1.17-0.53-7.47 1.49-2.77-1.52-0.68-3.34 0.93-0.94 1.72-0.15 0.41 0.81 6.3 2.03 1.23 1.11 1.28-0.03-0.51-0.56 1-0.86h-2.71l-1.03-5.97 1.68-2.91 0.84 0.66 0.87-0.79-1.57-1.19 0.85-4.51-3.15-0.76-0.85-2.86-6.92-2.31-3.17 1.19-1.12 2.53-2.55 1.34-2.18 3.85-1.93 0.46-1.63 3.85-4.1 1.87 0.38 4.43-1.63 0.53-1.17-0.43-1.9 0.99-1.74-0.89-8.42-1.57-6.31 2.35-0.85-6.58 2.72-5.95-1.68-2.46-10.1 1.19-1.58 1.65-3.42 0.61-9.27 4.91-0.73 0.91 2.26 0.28 1 2.68-0.92 0.56 0.35 1.21-1.76 1.7 1.35 3.31 6.2 8.17-0.87 1.04 0.82 1.72-1.44-0.28-4.37 2.2-2.71 0.25-5.55-0.76-1.22-4.75-9.19 0.28-0.54-1.59-1-0.13-0.52-1.14 0.66-2.28-0.81-4.96 1.9-2.4-8.85-19.84-0.03-1.95 2.67-8.07 0.09-2.54-1.41-2.79-5.22-6.4-0.74-2.59 1.34-4.75 1.8-1.78 4.35-1.91 1.68-3.15 4.29 0.51 9.08-2.52 3.29-1.53 2.79-2.26 1.46-3.44 2.44-2.98 0.89-0.03 0.44-1.15 3.21-2.7 11.88 3.97 3.48 0.36 11.87-3.26 2.5-2.01 9.97-2.85 4.79-3.39 5.51-5.33 2.25-5.74 2.45-2.91 4.57-1.99 7.91 0.1 3.39-2.14 2.86-2.96 3.73-1.86 4.38-0.41 10.01 1.82zm-10.54 94.93-1.35 1.97-0.14-1.65-0.51 0.43v-0.94l-0.87 0.53 0.59 0.71-0.27 1.54-0.9 0.46 3.59 1.57 0.55-0.78-0.38-0.63 0.98-0.68-1.42-0.38-0.19-0.81 0.97 0.1-0.62-1.11 1.5-0.76 0.22 0.53 0.98-1.16-0.35-0.58-0.74 0.73-2.93 0.05 1.29 0.86zm2.5 0.81-0.71-0.58-0.41 0.43 1.12 0.15zm-9.09 4.83-0.4 0.53 0.43-0.1-0.03-0.43zm6.73 3.7-1.6 0.46 0.59 0.58-0.66 0.56 1.84-0.3-0.17-1.3z" title="Noord-Brabant" class="land"/> <path id="NL-NH" d="m364.17 419.06 8.62 3.83 7.09 7.5-0.36 0.26-7.01-7.42-8.23-3.59h-2.78l2.67-0.58zm-94.39-72.61-8.24 1.02-1.69 0.92 0.81 0.81-0.55 0.55-1.39-0.1-0.87-1.34 0.9-1.68 4.13-2.44 3.37 0.47 3.42 1.23 0.11 0.56zm55.41 8.52-2.14 1.73-0.38 2.49 1.47-0.26 10.35 20.25-1.52 18.28 1.22 0.08 0.67 1.17 0.87 3.63 4.43 4.51 1.17 0.39 1.77 0.03 1.41-0.94 2.52-3.7 4.46 0.26 3.39 1.77 3.54-0.7 0.43 0.5-1.55 0.55 2.15-0.13 1.85 1.23 0.68 7.14 3.1 1.9-1.2-0.1-0.22 1.38-2.94 1.67 0.51 1.3-5.79 1.48-1.65 7.31-0.79 1.17-3.69 2.06-1.5 2.16-3.92 1.01-2.33 2.47-5.05 0.88-1.17-3.33-2.15 0.16-2.63-2.78-2.2 0.65-1.17 1.2-0.21-0.68-1.36 0.21 0.11 0.96-1.08-1.95-0.93 0.03-1.16 1.25-2.75 1.25-0.44 1.01 0.81 7.2-0.43 1.01 1.93 5.38-0.25 1.66 1.91 1.79 1.91 4.26-0.11 1.53 2.5 5.16 0.7 0.03-0.17 1.01 1.08 0.88 0.66 2.2-2.34 3.53-1.11-0.08-0.47 0.62 0.08 2.72 1.16 1.35-0.1 1.11-2.72-0.13-1.91 0.96-0.7-0.41 1.31 2.07 0.79-1.06 1.08 0.26-0.81 1.66 0.02 3.68 4.78 0.91 1.65-0.41 0.3-3.26 1.46-1.92-1.27-7.72 1.82 5.26 1.36 1.66 3.75 0.28-3.75 1.61-1.09 1.14h-1.17l-0.47 3.21-1.07 1.66-0.7 0.34-0.08-0.91-1.15 1.04-1.5 4.35-2.07-0.1-1.22 1.79-2.2 1.47-1.22 3.41-2.14 1.14 0.43 0.67-0.63 1.86-1.82-1.27-2.83 1.19-2.64-2.38-0.71 0.83 0.47 1.24 2.55 1.32-1.22 1.4-0.47-1.06-0.85 0.72 3.29 2.12 2.42 2.92 2.34 0.47 2.18-1.03 1.12 1.09-0.98 1.37 0.44 0.96 0.74-0.08-0.16-0.7 1.42 0.54 4.02-0.21 1.28-0.93 2.28 0.34 2.99 2.25 4.15 1.06 2.23 2.07 11-1.88 9.73 2.45 4.65 3.07 3.81 3.77-4.73 3.38-4.62-0.83-1.5 1.37-0.93-0.41-2.53 5.21-3.47 3.09-0.49 7.94-4.37 8.73-10.82-0.59-0.28-1.13 2.93-1.96 0.84-1.49-1.99-3.97-1.9-1.06-0.49 0.95-6.79 0.18-5.24-2.14-0.63-2.19 3.31-1.49-2.18-2.14-0.57-2.86-1.36 0.57-1.5-4.69 4.05-1.21 0.17-1.14 1.28-0.67 1.2 0.93-0.76-1.99-1.68 0.13-1.23 1.47-1.5-1.26-0.71 0.21-2.14 2.68h-0.7l-1.36-3.2-0.98-0.41-2.45 0.18-2.63 2.63-4.45-0.93-1.2 0.52 0.21 2.24-2.33 1.7-1.17 2.24-6.77 0.13-5.54 5.26-2.98 1.37h-2.47l-1.65-0.36-1.55 0.67-0.92 1.34-4.76 2.65-1.23 1.55-0.92-0.7-0.24-5.59-3.09-0.49-2.66 1.83-3.61 0.28-5.13 2.99-3.24 0.23-4.6-1.21-1.68 0.57-2.33-0.54-1.08-0.88-0.16-1.31 1.39-2.11 1.25-6.55-0.29-2.04 3.13-3.17 3.81-8.44-4.3-1.63-2.14 0.59-1 1.86-10.74-4.85 10.57-27.46 0.85-6.03 0.81-1.11-0.6-1.71 3.07-7.78 4.05-22.58 4.65-39.09 1.42-6.7 2.28-5.04 2.67-9.06 3.67-14.66 0.82-3.79 0.7-14.14 1.68-4.48 1.42-1.31 6.98-0.63-0.13 0.58 1-0.05-0.79 0.66 1.19 1.83 1.16-0.31 0.55-1.28-0.97-0.86 1.54-0.31 0.4 2.04-1.98 5.48 2.6 5.55 10.79 6.54 5.14-1.36 4.97-2.51 2.42-3.06 0.68-2.33 1.5-1.34 5.43-1.57 1.84 0.52 2.47-0.81 1.33 0.94 19.91-17.64 0.65 0.87-17.8 15.49zm-27.61-57.19 1.28 0.26 3.04 5.21-0.81 1.68-0.32-0.87-0.13 12.46-0.62 1.89-3.85 3.39-0.14 2.71-1.69 3.05-1.68 0.87-1.28 1.89-3.88 0.94-4.26 5.54 0.71 0.89-0.46 0.66-6.46-2.05-0.41 0.34 0.6 1 1.84 0.73 1.44 1.55-1.52-0.47-1.71 1 0.43 0.58-2.9 0.31-1.61 1.1-2.69-4.01-0.55-2.86 0.25-4.88 1.82-7.9 4.53-9.35 11.52-18.15 4.07-4.32 1.46-0.54999 1 0.41999 2.48 3.92 0.5 3.02z" title="Noord-Holland" class="land"/> <path id="NL-OV" d="m493.68 377 2.35 3.63 10.77 12.33-5.16 5.71-0.19 1.26-6.71 2.42-1.06 1.49 5.8 14.96 3 3.57 1.22-0.5 2.41 0.68 0.85-1.17 2.11-0.5 1.59 1.49 2.69 0.72 1.77 2.11 1.13 0.08 1.34 1.25 1.71-0.88 1.43 1.58 1.1-0.91 4.12-1.06 0.54 0.93-0.38 1.69 5.84 4.22 1.78 3.82 0.4 2.71 1.34 1.56 1.82-1.43 1.51 0.05 0.5-0.91 1.43 0.73 1.96-2.47 0.55 2.02 1.48 1.28 2.67-0.37 1.12-2.47 1.51 1.69 4.49 0.32 2.22 2.08-0.94-9.78 6.03-4.63 10.1-2.27 15.03 6.46-1.52 5.74 1.82 0.11 2.2 2.94-1.08 6.96 7.5 6.62-3.07 0.86-3.48-0.78-1.67 3.72-5.51-1.12 3.94 8.23-1.12 8.94 9.95 6.45 2.61 0.78 12.1-0.02-0.01 2.43 1.63-0.34 12.36 4.02 3.3-2.57 2.33-4.92 1.76-1.24 2.18 4.79 1.3 5.41 1.77 1.61 2.23 5.64 3.63 0.41 2.37 6.75-0.11 5.51-2.66 3.72-1.41 3.43-0.27 2.53-3.04 6.38 0.24 4.23 2.53 4.69 3.17 3.54-0.7 1.62-3.43 2.22-3.12 0.56-2.39-0.95-2.88 0.7-0.88 1.21-0.62 3.58-3.88 6.62-6.87 1.33-0.45 1.7-3.55 3.3-1.5 6.71-2.66 2.57-15.02 0.59-7.13 0.05-8.49-2.98 1.68-2.7-0.41-4.01 0.54-1.37-0.73-1.26-3.26-1.72-0.66-0.05-0.78 1.36-1.61-1.34-2.65 2.37-1.33-1.23 0.4-1.47-2.52-2.22-5.8 1.42-6.29-1.03-3.56 0.9-2.58-1.95-0.94-3.38-2.3-0.72-1.3-2.63-3.19-3.34-1.76-3.43 0.05-1.29-5.52-0.62-4.75 0.93-2 1.49-0.09 2.19-2.66 0.42-3.27-0.03-1.21-1.39-2.2 1-1.04-0.36-0.08 0.75-3.62-0.26-5.05-1.05-2.31-1.73-4.13-0.03-0.59 2.53-0.72-0.77-0.16 1.16-0.62-0.26 0.87 1.52-0.32 0.77-0.72-1.88-2.42-1.11-0.43-1.65 1.44-1.57 0.19-1.42-1.96 0.18-2.69-1.05 0.91-2.32-2.84-4.6-0.13-2.5-1.27-2.6-0.33-0.6-2.71-0.36-0.63-4-1.57-0.21 0.91-3.12 0.01-5.14 2.87-1.89-2.34-1.55-0.26-1.53 0.63-0.87 3.14-0.6 3.31-1.58 1.97-7.96-0.99-3.55-4.21-5.2-0.46-6.53-1.35-1.63-3.65-2.1-1.82-3.68-4.64-3.01-1.11 1.32-1.71 0.6-6.89 7.13-1.37-1.97-2.94 1.73-0.62-0.57-1.2 0.55-2.15-5.11-3.21-4.51-2.46-2.18-2.15 0.8-1.74-8.61-6.74-7.2-5.19-0.2 0.06-6.86 9.39 0.02 1.25-1.04 9.32-2.05 2.06 1.35 2.34-0.29 3.87-2.62 5.24-1.15 3.56-2.36 0.79-1.36-2.28-2.52-2.57-0.7-2.52-2.21-5.81-1.59-0.06-0.89 1.79-2.03 2.88-2.16 0.38-1.59-2.06-3.75-1.11-0.57-3.29-9.31-10.22-8.35-3.59-1.25h-2.9l-3.58-4.88 3.79-2.64 2.16 1.49 0.35 1.07 1-0.57 5.87 1.56 3.31-1.56 4.21-3.97-0.02-2.04 0.71-0.86 2.41-0.52 1.47 0.6 0.02-1.39 2.83-0.94 2.15 5.38 2.09 1 4.13-1.13 0.71 1.44 3.73-2.01-0.2-3.19 1.79-0.73 2.77 0.1z" title="Overijssel" class="land"/> </g> </svg> </body>
Do you want to create an hyperlink? If this is the case, here is an example: http://jsfiddle.net/447dpk2o/12/ The hyperlink is declared like this: <a xlink:href="http://www.google.com"> <circle cx="450" cy="300" r="20" fill="rgba(255,0,0,.5)"/> </a> And you need to add the following namespace in the root element: xmlns:xlink="http://www.w3.org/1999/xlink"