html SVG自定义地图
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html SVG自定义地图相关的知识，希望对你有一定的参考价值。
@import "compass";
.wrap {
width: 400px;
height: auto;
}
.map_svg {
display: block;
margin: 0 auto;
a {
polygon,
path {
transition-property: all;
transition-duration: 0.5s;
transition-timing-function: ease;
}
&:hover,
&:focus {
cursor: pointer;
polygon,
path {
opacity: 0.25;
}
}
}
}<div class="wrap">
<svg version="1.1" class="map_svg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="8 58.5 628.1 676.5" xml:space="preserve" role="img" aria-label="Carte de France par académie">
<g>
<a xlink:xlink:href="#" aria-label="nancy-metz">
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="513.8795" y1="695.7123" x2="513.8795" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_1_)" points="470.7,157.7 468.1,161.2 461.6,158.9 460.3,160.3 461.2,170 457.7,175.5 459.3,178.5
454.6,182.8 456.9,192.5 455.9,196.7 458.7,198 458,203.8 454.4,205 453.3,210.6 456.8,215.6 457.4,220.2 461,225.7 480.7,237.8
478,240.6 492,251 489.9,260.6 493,263.1 496,265.6 496.2,268.3 498.8,267.2 498.8,267.2 498.8,267.2 499.5,268.6 500.2,269.9
500.7,269.5 500.8,269.5 508.8,263.8 508.8,263.8 508.8,263.8 509.4,264.1 509.4,264.1 516.9,268.6 523.3,266.8 528.8,270.9
534.5,268.4 534.5,268.4 534.5,268.4 540.2,272.8 543.8,275.7 544.2,275.4 546,273.9 546.9,273.1 546.9,266.3 552.3,257.4
557.1,242 557.3,241.9 552.3,239.6 553.8,228.3 552.1,227.1 552.1,227.1 548.8,224.9 556.2,225.7 558.1,224.1 561.3,210.1
557.1,207 554.9,206.6 553.1,209.7 548.8,206.8 550.6,204.1 544.6,201.4 551.5,186 553.2,191.2 562.7,196.2 571.9,195.8
573.2,193.5 574.5,189.7 566,182 559.2,186.4 551.4,185 547.9,186.7 545.1,181.8 542.5,180.5 540.2,181.8 539.8,185.8 535.4,184.6
526,173.9 524.1,167.4 521.2,165.4 509.5,162.8 504.6,166.6 500.9,166.7 494.9,164 494.9,164 494.7,163.9 494.3,163.7 491,160.8
484.3,160.8 482.9,163.7 476.3,164.7 475.9,164.7 475.3,164.7 471.7,157.1 " />
</a>
<a xlink:href="#" aria-label="strasbourg">
<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="573.422" y1="695.7123" x2="573.422" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_2_)" points="573.1,197.8 562.2,198.2 551.5,192.6 551.2,191.6 547.3,200.4 553.5,203.3 551.5,206.2
552.4,206.9 553.8,204.4 557.9,205.1 563.6,209.3 559.9,225.3 556.8,227.7 555.9,227.6 554.4,238.4 561,241.3 558.8,243.2
554.1,258.3 548.9,266.9 548.9,273.5 548.9,274 548.6,274.3 548.6,274.3 546.5,276.1 553.9,281 553.9,281 554.3,281.3 554.3,281.8
554.3,281.8 554.8,290.9 557.6,290.8 560.3,296.9 563.5,297.5 562.7,300.7 569.8,300.7 572,299.9 572.6,296.3 575.8,296.1 576,293
578.3,291 575.2,282.7 578.2,265.3 576.1,253.6 582.8,237.8 584.4,220 596.3,204.6 600.3,193.7 591.8,190.7 576.4,190.2 575,194.4
" />
</a>
<a xlink:href="#" aria-label="lille">
<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="359.778" y1="695.7123" x2="359.778" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_3_)" points="319.5,111.2 326.9,117.2 341.8,114 341.8,114 341.8,114 338.3,121.9 339.2,123.6
341.5,120.7 350.6,124.5 352,120.3 355.7,126.5 358.7,124.4 359.7,128.3 368.8,126.4 372.6,129.5 386.1,128.8 389.3,126
392.1,128.1 397.4,126.3 397.4,126.3 397.7,126.2 398,126.2 398,126.2 414.9,130.7 417.8,125.2 414.5,119.3 416.4,113.4
414.4,113.8 409.7,108.3 403.3,109.4 397.5,108 394.2,111.1 391.5,99.8 385.5,98.4 384.5,96.1 381.9,98 377.4,96.5 373.7,86.3
374.2,83.1 370.4,78.8 364.7,79.4 358.1,84 354,82.1 350.9,76.4 347.2,76.4 345.3,72.6 346.5,66.1 343.9,59.9 341.4,58.5
323.5,62.9 308.4,67.6 302.4,72.7 302.3,92.2 309.5,100.8 302.3,96.2 301.8,101.1 302.2,104.8 304.2,106.2 318.3,107.5 " />
</a>
<a xlink:href="#" aria-label="amiens">
<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="356.6085" y1="695.7123" x2="356.6084" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_4_)" points="307.2,138.1 307.3,138.3 307.3,138.3 311.4,148.3 307.8,153.6 309.3,163.3 307.8,172.2
312,182.1 307.5,185 308.7,187.3 314.3,188.4 321.4,186.4 331.5,188.8 334.2,186.8 346.8,194.2 353.8,195.2 356.3,192.6
359.4,194.6 368.3,191.4 371.9,192.3 374.4,195.8 373.6,198.9 377.6,203.1 387.1,209.4 394.4,199.5 391.9,198.2 393,194.8
390.9,191.4 397.1,188.9 393.8,180.4 395.5,176.7 405.1,171.9 410.5,173.7 411.2,171.6 410.9,154.9 414.5,154.6 419.5,147.3
418.1,143.9 419.6,139.9 418.9,134.6 415.7,133.5 414.3,136 414.3,133.1 414,132.9 414.1,132.6 397.8,128.3 391.8,130.3
389.4,128.6 386.8,130.8 371.9,131.5 368.3,128.6 358.2,130.7 357.4,127.7 355,129.3 352.5,125.1 351.9,127.1 342.2,123.1
338.9,127.2 336,122 338.3,116.8 326.4,119.4 317.8,112.4 316.8,109.3 304,108.2 300.6,109.5 300.3,112 305.2,120.9 299.8,118
293.6,126.5 " />
</a>
<a xlink:href="#" aria-label="reims">
<linearGradient id="SVGID_7_" gradientUnits="userSpaceOnUse" x1="441.9655" y1="695.7123" x2="441.9655" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_7_)" points="421.6,140.4 421.6,140.4 420.2,143.9 421.8,147.5 415.6,156.5 413,156.7 413.2,172
411.8,176.3 405.2,174.1 397,178.1 395.9,180.4 399.7,190 393.8,192.4 395.2,194.6 394.4,197.2 397.4,198.9 388.3,211.1
387.8,213.1 387.8,213.1 387.7,213.4 387.5,213.7 387.5,213.7 385.2,215.7 388.7,224 392.2,226.3 388.1,233.1 385.2,233.8
385.6,241.9 386.2,242.2 389.4,243.4 394.6,250 397,257.8 398.7,255.8 403.8,261.6 409,273.2 422.7,271.5 425.7,272.8 427.9,270.9
434.8,269.9 440.2,265.4 443.8,265.9 443.8,265.7 449.6,266.9 450.2,270.1 453.4,271.2 453.1,274.2 455.8,274.6 458,277.4
459.5,281.7 456.5,284.5 458.4,288.6 468.6,290.9 472.5,292.9 472.5,295.2 475.6,294.1 476.2,293.8 477.5,291.1 485.7,286.2
488.3,288.3 490.6,287.6 490.9,278.5 492.4,276.8 493.8,275.1 493.8,275.1 493.8,275.1 497,275.5 498.7,273 498.7,271.5
498.1,270.4 497.9,269.8 494.5,271.1 494.5,271.1 494.5,271.1 494.1,266.6 487.7,261.4 489.7,251.8 475,240.8 477.6,238.2
459.5,227.1 455.5,220.9 454.9,216.4 451.2,211 452.7,203.4 456.1,202.3 456.6,199.2 453.6,197.8 454.8,192.5 452.3,182.1
456.8,178.1 455.4,175.4 459.1,169.5 458.2,159.5 461.1,156.5 467.4,158.8 468.9,156.9 467.4,157 467.5,153.1 461.3,151.6
453.8,145 446.4,145.2 447.5,137.1 444.3,130.7 444.3,125.6 447,120.6 445.4,119.7 441.6,123.7 439.6,131.1 429,135.9 422.9,133.8
420.9,134.4 421.7,140.1 " />
</a>
<a xlink:href="#" aria-label="creteil">
<linearGradient id="SVGID_11_" gradientUnits="userSpaceOnUse" x1="361.8785" y1="695.7123" x2="361.8785" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<path fill="url(#SVGID_11_)" d="M347.8,197.8l-2.6,3.2c-0.3,0.2-0.6,0.4-0.9,0.6c-0.4,0.3-0.9,0.6-1.4,1l-3.5,2.4l-3-1.3l-2.2,0.9
l1,1.5l-0.1,1.5l0.1,1.6l0.5-0.3v-2.7h6.9l5.8,2.7l5.5,5.4v4.2l-1.5,4.1l4.5,1.9l4.7,0.4v6.2l-2.5,1.5l-2.6-3.7h-3.7l-0.5,1.5h-4.9
v0.8h-2l-2.7,11.8L339,248l0.6,2.8l4.9,5l-0.8,4l-0.5,0.3l6.9,0.5l12.1-2.9l3.9-5.5l0.3-6.2l0-0.9l11.8-2.3l5.4-1.1l-0.5-9.6
l3.7-0.9l2.7-4.4l-2.3-1.5l-4.3-10.2l3.1-2.8l0.3-1.2l-10-6.6l-4.8-5.1l0.8-3.3l-1.5-2.1l-2.4-0.6l-9.3,3.4l-2.5-1.6l-2.1,2.2
l-6.9-1L347.8,197.8z" />
</a>
<a xlink:href="#" aria-label="versailles">
<linearGradient id="SVGID_12_" gradientUnits="userSpaceOnUse" x1="320.8845" y1="695.7123" x2="320.8845" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<path fill="url(#SVGID_12_)" d="M301.9,211.5L301.9,211.5l0.1,0.2l0,0.2l0,0l0.5,11.8l6.9,6l1.4,6.3l1.8,1.8l3.9-0.8l3.2,12
l6.5-0.8l2.9-4l0,0l0,0l1.9,3.4l2.5-1.5l4,0.6l3.4-4.6l2.5-11h-5.6l-4.4-4.4l-5.6-2.2v-1.4h-3.9l-2.7-2.2l-0.1-1
c-0.1-0.2-0.1-0.4-0.1-0.6c0-0.2,0-0.4,0-0.6l-0.2-0.6l0.5-0.5l3.3-4h4.6l1.3-0.8c0.3-0.3,0.5-0.4,0.7-0.5l0.2-0.1l2.1-1.5
l-0.3-2.9l0.1-0.9l-2-2.9l5.2-2.1l2.8,1.1l2.6-1.8c0.5-0.4,1-0.7,1.4-1c0.3-0.2,0.5-0.4,0.8-0.5l1.7-2.2l-0.2-1.4l-11.2-6.6
L332,191l-10.5-2.6l-7.1,2l-6.5-1.2l0,0l-0.5-0.1l-0.7-1.4l-0.3-0.7l-3.7,8.6l0,0l-0.3,0.6h-0.7H298l-1.9,2.1l1.8,5.9L301.9,211.5z
" />
</a>
<a xlink:href="#" aria-label="dijon">
<linearGradient id="SVGID_15_" gradientUnits="userSpaceOnUse" x1="421.9665" y1="695.7118" x2="421.9665" y2="160.7126" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_15_)" points="385.7,244.1 384.6,243.6 368.3,246.8 368,252.7 368,252.7 368,252.9 364,258.5
364.6,259.2 371,266.3 371,266.3 371.2,266.6 371.2,266.9 371.2,266.9 371.8,273.9 366.7,279.2 367.9,282.4 365.8,285.7
360.7,288.9 363.3,291.4 366.1,300.4 362.4,301.3 361.1,303.3 363.3,310.4 361.5,316.5 364.3,318.7 367.9,327.6 368.2,333.9
370.8,336.2 370.4,343.4 369,352.9 373.9,358.3 374.9,359.3 381.4,359.5 384.9,357.3 389.6,361.3 396.6,354.2 404.6,370.3
413.4,373.6 415.6,376.8 415,383.6 410.8,388.8 410.8,391.3 415.8,394.5 425,392.7 427.1,394.9 432.4,391.3 432.8,388 436.4,385.1
438.8,387.1 441.3,385.3 443.8,386.9 445.8,383.9 451.9,392.1 458.2,369.6 465.6,371.5 471.7,370 477.1,373.6 479,372.9
478.1,367.4 481.3,361.9 480.2,357.3 479.1,352.8 477.2,351.7 475.4,350.5 475.4,350.5 475.4,350.5 478.1,348.4 480.9,346.4
472.5,342 471.9,337.8 473.2,332.9 480.2,325.3 482.2,316 483.3,314.9 479.4,306.6 475.4,304.5 475.4,304.5 475.4,304.5
475.4,304.5 475.4,304.5 481.4,299.3 481.3,296.5 479.6,294.1 479.6,294.1 477.7,295.3 477.7,295.4 477.4,295.5 474.6,297.3
475,296.4 470.5,298.2 470.5,298.2 470.5,294.1 467.8,292.8 457,290.4 454,284 454,284 454,284 457.2,281.1 456.3,278.4
454.7,276.5 450.8,276 451.3,272.6 448.5,271.6 447.9,268.6 445.8,268.1 445.8,268.2 440.8,267.5 435.7,271.8 428.8,272.8
426,275.2 422.4,273.5 407.8,275.4 402,262.6 398.7,258.8 396.1,261.8 392.8,251 388.1,245 " />
</a>
<a xlink:href="#" aria-label="besancon">
<linearGradient id="SVGID_17_" gradientUnits="userSpaceOnUse" x1="515.9734" y1="695.7123" x2="515.9735" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_17_)" points="554.9,297 554.9,297 558,296.7 556.3,292.8 552.9,293.1 552.9,293.1 552.9,293.1
552.4,282.4 544.8,277.4 544.6,277.5 543.7,278.1 534.2,270.7 528.5,273.2 522.9,269 516.6,270.8 508.9,266.2 502,271 500.8,271.9
501,273.3 497.9,277.7 494.6,277.3 492.8,279.3 492.7,284.2 492.5,289 487.9,290.5 485.6,288.6 480.5,291.7 480.8,292.2
480.8,292.2 483.2,295.9 483.5,300.1 483.5,300.1 483.5,300.1 478.9,304.1 480.9,305.2 485.6,315.3 484.1,317 482.1,326.3
475,333.9 474,338 474.4,340.7 484.6,346.1 484.6,346.1 484.6,346.1 478.9,350.3 480.8,351.6 483.4,362.2 483.4,362.2 483.4,362.2
480.2,367.8 481.3,374.1 478.5,375.2 482.3,382.4 486,382.4 486,382.4 486.1,385.8 488,385.7 492.7,380.5 497.6,382.8 498.1,385.6
501.2,385.4 507,382.1 511.6,375.6 511.6,375.6 515.9,361.3 528.9,349.3 527.9,338.3 538,331.4 550.7,315.6 550.5,312.3
552.6,310.3 548.2,306.7 549.5,302.3 550,301.9 554.1,297.3 554.4,297.2 554.6,297.1 " />
</a>
<a xlink:href="#" aria-label="orleans-tours">
<linearGradient id="SVGID_26_" gradientUnits="userSpaceOnUse" x1="299.0795" y1="695.7123" x2="299.0795" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_26_)" points="281.2,380.1 280.8,380.8 282.5,381.6 289.3,380.3 290.9,382.6 293.5,379.9 306.2,378.8
308.5,375.8 323.7,378.9 326.7,378 331.7,378.2 335.4,372 335.4,372 335.6,371.6 336.1,371.5 336.1,371.5 345.5,370.5 346.8,368.5
344.9,362.4 348,359.7 357.6,356.4 363.1,352.2 367.1,352.2 368.4,343.1 368.7,337 366.3,334.9 366,328 362.6,319.9 359.2,317.3
361.2,310.4 359,303 361.1,299.5 363.6,299 361.6,292.5 357.4,288.5 364.3,284.3 365.6,282.2 364.4,278.8 369.7,273.1 369.3,267.4
363.1,260.5 362.4,259.7 350.2,262.6 336.5,261.6 342,258.5 342.4,256.4 338,252 338,252 337.8,251.8 337.1,248.7 334,248.2
330.3,250.5 328.9,248.1 327.4,250.2 318.3,251.3 315.1,239.5 312,240.1 309,237.1 307.6,230.8 300.6,224.7 300.1,212.3
296.8,206.3 291.2,212.7 291.5,216.3 283.6,218.1 280.6,216.4 274.9,219.8 268.4,220.9 266.2,223.2 266.2,226.1 271.7,231
271.4,236.4 272.1,242.1 263.7,247.9 264.7,255.5 267.2,259.9 267.1,260.3 267.1,260.3 266.7,262.2 266.7,262.5 266.5,262.9
264.8,264.6 266.3,266.6 266.8,273.5 259.4,286 256,287.2 255.4,290.3 255.4,290.9 246.1,296.3 243.9,296.1 244.5,300.3
237.1,297.2 236.5,298.8 234.7,309.3 228.4,325.8 228.6,325.8 233.9,328.9 233.9,328.9 234.3,329.2 234.6,332.3 237.7,332
239.3,339.2 241.9,340.5 251.3,340.1 248.9,335.4 258.2,340.5 258.4,344.3 268.8,359 268,365.4 272.5,369.7 276.1,369.7 279,376.1
282.5,377.8 " />
</a>
<a xlink:href="#" aria-label="clermont-ferrand">
<linearGradient id="SVGID_29_" gradientUnits="userSpaceOnUse" x1="380.6025" y1="695.7123" x2="380.6025" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<path fill="url(#SVGID_29_)" d="M417,486.6L417,486.6l0.2-0.2l6.5-2.1l3.9-6.8l3.2-0.3l-0.7-2.7l3.2-2.7l1.9-6.7l2.5,1.2l0-2.1
l0.9-4.2l-0.1-0.1l-1.6-1.7l-3.6,1.3l-0.8-6.9l-5.7-2.1l-7,3.3l-3.6,0.6l-2.5-2.2l-4.6,1.3l3.9-9.6l-2.8-7.8l-5-4.1l-5.6-9.2
l2.4-6.9l-3.1-3.4l6.6-5.6l-1.7-13.7l0.6-4l4.7-1.6l3.8-4.7l0.4-5.4l-1.4-2.1l-9-3.3l-7.1-14.3l-6.4,6.5l-5-4.3l-2.8,1.8l-7.9-0.2
l-0.3-0.3l0,0l-0.7-0.8l-5.5-6h-3.7l-5.4,4l-9.3,3.2l-1.8,1.6l1.8,5.8l-2.4,3.5l-9.8,1.1l-3.4,5.8l1,3.7c0.8,0.5,1.6,1.1,2.5,1.6
c0.5,0.3,0.9,0.6,1.4,0.9c1.4,0.9,2.8,1.8,4.1,2.7l0.2,0.2l4.3,9.9l-0.6,4.6l2.7,8l-10.3,9.5l4.6,5.6l1.6,6.9l-2,2.8l2.4,16.9
l-7.4-2.3l-0.5,2.9l-8.2,10.3l2.1,2.7l-3,2.5l-0.3,4.1l-3.1,1.1l1.6,3.6l-3.9,2.2l0.7,4l0.2,1.3l4.4,6.9l-2,6.5l2.9,4.4l5.3-3.3
l6.9,1.7l3.8-4.9l3.4-10.3l6.1-5.5l6.8,5.3l1.4,4.7l2.9,2v0l0,0l-0.7,3.7l1.8,3.5l6.6-15.2l0.3-0.7l0,0l0.6-1.5l1,1.2l0,0l1.4,1.7
l8.5-7.4l3.5,2.6l1.5,6.1l5.5,1.1l0.2-3.1l4.5,0.4l9.7,8.2L417,486.6z" />
</a>
<a xlink:href="#" aria-label="limoges">
<linearGradient id="SVGID_30_" gradientUnits="userSpaceOnUse" x1="300.3919" y1="695.7123" x2="300.3919" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<path fill="url(#SVGID_30_)" d="M323.9,476.5l-1.8-3.8l3.9-1.5l0.3-3.7l2.2-1.7l-1.9-2.3l8.8-11.1l0.9-4.7l6.6,2.1l-2-14.5l2-2.8
l-1.2-5.5l-5.4-6.6l10.7-9.9l-2.5-7.2l0.6-4.6l-3.9-8.9c-2.6-1.8-5.4-3.5-8-5.2l-0.3-0.2l-1.1-4.1L327,380l-3.2,0.9l-14.4-2.9
l-2.1,2.7l-12.9,1.2l-3.8,3.8l-2.2-3.1l-6.2,1.1l-3.3-1.4l-1.4,2.7l-3.7-0.9l-1.1,2.9l-6.5,3.1l-3,5.1l-0.2,8.8l5.3,4.1l-0.9,4.7
l-3.1,1.3l-4.5,9.1l-3.2,0.7l-2.2,2.4h0.1l-0.6,0.7l5.1,2.5l0.7,0.3l0,0l0.6,0.3l0,0.6l0,0l-0.1,4.1l10-1.2l9.1,7.2l-2.1,2.8
l5.6,2.1l1.8,3.1l1.8,3.1l-4,5.2l2.1,3.4l-1.9,1.7l1.9,1.3l0.2,3.1l3.4,0.7l3.7,7.6l9-0.8l0.3,0.3l0,0l7,6.3l5.5-2.8l7.6,0.1
L323.9,476.5z" />
</a>
<a xlink:href="#" aria-label="lyon">
<linearGradient id="SVGID_31_" gradientUnits="userSpaceOnUse" x1="458.813" y1="695.7123" x2="458.813" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_31_)" points="508.3,383.6 501.8,387.4 496.4,387.8 495.8,384.2 493.2,382.9 488.9,387.7 484.2,387.8
484.2,387.8 484.2,387.8 484.1,386.1 484.1,384.4 481.7,384.4 481.1,384.4 477,376.7 476.3,375.5 471.4,372.2 465.5,373.5
459.6,372 452.8,396.5 445.9,387.3 444.3,389.6 441.4,387.7 438.7,389.7 436.3,387.7 434.7,389 434.3,392.5 426.8,397.5
424.3,394.9 415.4,396.6 409.3,392.7 409.3,392.7 408.8,392.4 408.8,391.8 408.8,389.8 406.3,390.7 406,393.2 407.7,407.7
401.9,412.7 404.4,415.5 401.9,422.6 406.9,430.7 412.1,435 415.3,444 412.7,450.5 414.3,450 417,452.3 419.4,451.9 426.8,448.4
434.5,451.3 435.1,456.8 437.5,455.9 438,456.4 438,456.4 440.1,458.6 443,458 446.5,452.6 451.8,449.8 451.8,445.5 451.6,443.8
456.3,439.6 454.2,436.8 457.8,433.2 465.5,431.5 467.9,426.7 467.5,417.5 474.9,419.9 478.1,414.5 482.4,413.5 494.4,430.1
499.9,423.7 502.3,408.9 501.5,397.4 505.3,397.4 507.5,395.1 507.5,395 508.2,388.9 514.7,384.9 515.8,378.2 513.2,376.8 " />
</a>
<a xlink:href="#" aria-label="grenoble">
<linearGradient id="SVGID_35_" gradientUnits="userSpaceOnUse" x1="490.1935" y1="695.7123" x2="490.1935" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_35_)" points="506.2,399.4 505.7,399.4 503.6,399.4 504.3,409 504.3,409.1 501.8,424.5 494.3,433.3
481.5,415.7 479.4,416.3 475.8,422.3 469.6,420.3 470,427.1 466.8,433.3 458.8,435 456.9,437 459,439.8 453.7,444.6 453.8,445.4
453.8,451 447.9,454.2 444.3,459.8 440.6,460.6 439.7,464.5 439.7,469.5 436.5,467.9 435,473 432.3,475.3 433.2,479 428.8,479.4
425,486 418.2,488.2 411.2,494.8 412.5,500.3 413.4,504.4 421.1,520 429.1,525.1 437.8,519.7 438,522.7 439.6,521.3 443.3,521.3
448.8,524.5 448.7,522.1 448.7,522.1 448.7,521 449.9,521.1 449.9,521.1 456.8,521.9 460.5,526.4 470,522.1 472.5,523.6
476.4,520.3 477,527.9 487.5,528.9 487.7,532.3 492.3,534.3 496.9,529.2 499.8,529.1 500.1,529 500.2,525.2 489.3,518.9
487.2,515.2 491.6,508.3 496.4,510 497.9,508.3 494.9,506.2 498.2,497.3 504.4,496.9 504.8,493.7 506.1,489.7 512.2,488.3
513.3,485.2 528.2,480.7 528.2,480.7 528.2,480.7 530.7,481.5 531,476.9 526.3,473.6 524.1,468.2 526.4,462.6 535.4,466.7
537.3,464.7 544,463.4 565.6,454.1 567.5,450.8 566.2,447.9 569.1,442.4 561.4,437.1 558.7,430.3 559.4,427.3 553.7,425
550.1,421.6 549.5,417.9 549.5,417.9 549.5,417.7 549.4,417.7 549.4,417.5 549.4,417.1 549.4,417.1 549.9,416.6 549.9,416.6
549.9,416.6 549.9,416.6 559.1,407.8 559.9,405 556.5,400.4 547.3,391.7 550,384.5 545.9,378.7 546.3,376 543.7,375.4 534.6,376.1
528.8,381 525.2,379.4 522.7,384.6 525.7,388.3 516.8,395.1 509.3,396.1 " />
</a>
<a xlink:href="#" aria-label="rouen">
<linearGradient id="SVGID_38_" gradientUnits="userSpaceOnUse" x1="271.5985" y1="695.7123" x2="271.5985" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_38_)" points="244.2,178.8 248.8,178.8 245,182.5 248,192.8 246.5,196 249,200.6 248.2,203.3
248.3,205.8 254.9,206.3 264.5,218 262.8,220.2 263,220.3 265.1,221.5 267.3,219.1 274.2,217.9 280.5,214.1 283.9,215.9
289.4,214.7 289.1,212.1 289.4,211.7 289.4,211.7 295.8,204.4 293.8,197.7 297.1,194.2 301.1,194.2 305.1,184.6 304.9,184.3
305.4,183.9 306.2,182.2 306.6,183.2 309.5,181.3 305.7,172.4 307.2,163.3 305.7,153.2 309.1,148.1 305.5,139.3 292.3,128.1
280.3,136.4 255.4,142.6 239.8,151 233.7,164.4 235,166.1 245,168.4 247.8,169.3 243.9,170.6 " />
</a>
<a xlink:href="#" aria-label="caen">
<linearGradient id="SVGID_41_" gradientUnits="userSpaceOnUse" x1="206.732" y1="695.7123" x2="206.732" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_41_)" points="162,232.3 164.1,233 172,227.7 178.6,230.4 180.5,230.6 188.1,231.3 188.1,231.3
188.5,231.3 191.9,235.1 194.5,233.5 197.3,235.5 204.6,231.9 214.3,231.9 215.1,228.9 219.7,229.2 222,236.2 225.7,238
225.7,240.9 227.9,241 240.5,234.4 244.4,236.6 246.2,246 253.6,251.1 256.9,249.9 260.8,254.1 262.6,254.5 261.6,246.9 270,241.1
269.4,236.4 269.6,231.8 264.2,227 264.2,223.4 259.9,220.8 260.5,219.9 260.5,219.9 262,218 253.9,208.3 246.4,207.6 246.2,203.1
246.9,200.8 244.2,196 245.9,192.6 242.7,181.9 243.9,180.8 242.3,180.8 241.9,171.2 235.4,172.7 230,177.4 218.6,180.6 209,176.5
194.8,175 184.5,171.4 179.6,173.5 179.6,173.5 179,173.8 178.2,174.6 170.2,161.1 172.9,152.3 172.1,150.1 165.8,149.4
163.1,151.4 155.3,151.9 143.6,147.2 143.5,148.2 147.1,150.3 147.7,156.8 145.6,159 148.4,169.7 158,180.1 156.5,191.4
158.7,194.5 158,202 155.6,208 159.9,217.9 162.1,218.9 166.8,215.8 164.6,222.4 157.4,223.2 157.9,224.1 " />
</a>
<a xlink:href="#" aria-label="rennes">
<linearGradient id="SVGID_42_" gradientUnits="userSpaceOnUse" x1="92.7845" y1="695.7123" x2="92.7844" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_42_)" points="147.7,284.3 149.4,281.3 160.3,276.6 167.2,280.2 167.5,278.9 171.7,268.8 177.6,266.5
175.5,247.4 177.2,244.7 177.3,232.1 172.3,229.9 164.4,235.2 160.9,234.1 160.5,233.9 160.4,233.6 160.4,233.6 155.2,223.3
142,223.4 142.3,217.4 140.1,217.8 136.4,221.4 139,227.2 139,227.2 140.3,230 139,229.1 139,229.6 134.8,226.1 134.7,226.1
134.6,226 134.7,226 134.5,225.9 133.6,223.6 131.4,221.4 131.3,221.4 131.2,222.5 131.2,223.4 124.9,224 123.9,220.8 120.6,222.4
119.3,219.2 116.3,219.4 103.3,230.2 102,224.9 97.4,222 97.3,218.2 92.5,210 88.7,209.2 89.3,206.4 87.8,206.5 83.2,215.3
83.2,215.3 83.2,215.3 85.3,203.7 80.7,206.8 80,202.5 70.4,206.5 69,204 65.2,207.1 64.9,214.4 59.9,215.1 54.6,211.8 52.4,212.2
51.4,217.5 48.6,214 45.6,219.9 45.5,209.8 29.8,214.5 28.2,211.7 19.3,216.6 25.1,219.6 11.1,218.3 9.5,220.3 8,229.6 9.3,231.3
12,230.2 15,231.5 28.5,227.5 29.2,229.4 25.5,231.2 25.2,233 31.9,231.3 31.2,235.3 36.8,237.7 33.3,238.4 37.3,240.1 36.7,242
29.7,240.3 28.8,238.6 27.5,238 24.6,238.8 17.5,237.4 16.4,235.9 15.5,237.9 17.4,241.7 18.6,239.7 22.6,240 29.2,243.8
30.4,248.3 27.9,252.2 24.5,250.4 11.2,251.8 10.4,253.1 20.3,256.8 24.8,264.4 23.8,269.9 30.4,270.5 33.9,266.4 32.8,262.3
34.3,262 35,255.9 38.8,263.4 36.2,263.8 36,265.9 38.5,267.5 43.8,265.5 49.1,272.3 50.9,271.9 50.9,269.5 52.9,269.4 53.2,271.3
56.6,270 55.7,274 57.8,274.5 61.1,273.1 61.2,270.3 63.2,270.3 64,278.4 66,279.7 67.9,278.7 67.4,272.8 69.4,272.5 69.9,275.2
74.4,276.1 71.2,279.3 72.3,281.3 75.7,282.7 78.3,281.6 79.2,283.4 77.1,284.5 77.3,286.6 79.8,290 79.4,291.9 81.5,290.1
85.8,289.1 86.8,289.9 84.8,280.2 90.3,289.2 91.5,287.1 96.8,288 99.8,291.6 96.8,295.5 92.8,295 95,296.7 108.8,295.6
114.9,298.9 126.4,295.5 126.8,289 133.3,284.8 " />
</a>
<a xlink:href="#" aria-label="nantes">
<linearGradient id="SVGID_44_" gradientUnits="userSpaceOnUse" x1="185.6545" y1="695.7123" x2="185.6545" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<linearGradient id="SVGID_86_" gradientUnits="userSpaceOnUse" x1="125.4045" y1="695.7123" x2="125.4045" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<linearGradient id="SVGID_87_" gradientUnits="userSpaceOnUse" x1="119.414" y1="695.7123" x2="119.414" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_44_)" points="226.3,325.7 232.8,308.6 234.6,298.2 235.8,294.5 242,297.1 241.6,293.9 245.6,294.3
253.5,289.7 254.3,285.6 258.1,284.4 264.7,273.1 264.4,267.4 262.1,264.4 264.8,261.7 265.1,260.3 263.1,256.7 259.7,255.9
256.4,252.3 253.3,253.3 244.4,247.2 242.7,237.9 240.4,236.6 228.4,243 223.7,242.9 223.7,239.2 220.3,237.6 218.2,231.1
216.6,231 215.8,233.9 205.1,233.9 197.2,237.8 194.4,235.9 191.6,237.7 187.6,233.3 179.3,232.5 179.2,245.3 177.6,247.9
179.7,267.8 173.2,270.4 169.4,279.6 168.7,283.2 160.2,278.8 150.9,282.9 148.9,286.3 134,286.8 128.7,290.2 128.3,297.1
110.6,302.3 106.2,306.6 108.5,312.3 115,313.4 116.9,315.3 122.1,311.5 137.5,310.2 123.8,315.4 123.1,322.8 121.4,323.5
126,325.1 132.2,331.6 123.1,341.3 123.5,345.5 135.1,359.1 137.4,366.9 146.1,374.2 151.8,375.4 153.5,379.4 160,380.7
164.2,384.1 164.8,381.7 168.6,382.2 180.6,377.6 178.7,381.6 184.7,381.4 187.1,383.2 195.4,379.1 193.4,377.7 193.7,368.9
188.4,349.2 183.8,344.6 180.7,336.8 195.3,335.7 199.5,330.5 206.2,329.6 217.7,329.3 219.8,331.5 " />
<polygon fill="url(#SVGID_86_)" points="128.4,332.1 124.2,327.7 122.4,327 126.2,334.5 " />
<polygon fill="url(#SVGID_87_)" points="120.5,321.6 121,315.6 117.8,317.9 119.8,321.9 " />
</a>
<a xlink:href="#" aria-label="poitiers">
<linearGradient id="SVGID_47_" gradientUnits="userSpaceOnUse" x1="221.285" y1="695.7123" x2="221.285" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<linearGradient id="SVGID_85_" gradientUnits="userSpaceOnUse" x1="158.4579" y1="695.7123" x2="158.4579" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<linearGradient id="SVGID_76_" gradientUnits="userSpaceOnUse" x1="159.4635" y1="695.7123" x2="159.4635" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_47_)" points="219.8,462.5 219.8,461.5 220.5,461.5 222.7,459.5 228.8,458.6 232.9,452.7 233.8,446.1
242.7,439.4 245,433.7 245,433.7 245.1,433.6 245.2,433.4 245.2,433.4 245.8,432.8 250.1,428.2 250,428.2 255.6,422 258.5,421.3
262.9,412.4 265.7,411.3 266.1,408.8 261,404.9 261.2,394.5 264.8,388.4 271.2,385.4 272.6,381.6 276.5,382.6 277.9,379.8
277.9,379.8 277.9,379.8 279,380.1 279.8,378.6 277.5,377.6 274.8,371.7 271.7,371.7 265.9,366.2 266.7,359.6 256.5,344.9
256.3,341.7 253.6,340.2 254.4,341.9 241.4,342.5 241.4,342.5 241.4,342.5 237.6,340.6 236.2,334.2 232.9,334.5 232.4,330.4
228.4,328 227.4,327.4 219.7,334.3 216.8,331.3 206.4,331.6 200.6,332.3 196.4,337.7 183.6,338.6 185.5,343.4 190.2,348.2
195.7,368.7 195.5,376.7 199.1,379.5 186.9,385.6 184,383.4 175.6,383.8 176.7,381.2 169.5,384 165,393.5 167.6,394.3 173.1,404.9
169.7,405.4 171.3,410.7 167.7,417.8 162.8,421.2 163.9,424.9 172.6,430.3 184.4,443.1 186.7,450.9 193.3,450 194.1,453.5
201.4,455.4 202,462.2 208.3,466.5 217.9,467.5 219.8,462.9 " />
<path fill="url(#SVGID_85_)" d="M148.3,385.3c0,0.1-0.1,0.1-0.1,0.2c-0.3,0.4-0.3,0.9-0.1,1.4l1.3,3.1c0.2,0.5,0.6,0.8,1.1,0.9
c0.1,0,0.2,0,0.3,0c0.1,0,0.3,0,0.4-0.1c0,0,0.1,0,0.1,0l0.8-0.2l4.4,3.9l0.7,0.6l0.1,0l4.3,8.6l1.8,1.2c0.4,0.2,0.6,0.6,0.7,1.1
l0.5,3.6l0.6,4.7c0,0,0,0,0,0l0.1,0.4l-0.2,0.4c0,0,0,0,0,0l-0.8,1.8l1.5-1l1-2l1.8-3.6l-1.6-5.4c-0.1-0.4-0.1-0.9,0.2-1.2
c0.2-0.4,0.6-0.6,1-0.7l1.1-0.2l-3.4-6.6l-2.7-0.8c-0.4-0.1-0.8-0.4-0.9-0.8c-0.2-0.4-0.2-0.9,0-1.2l2.9-6.1l-0.1,0
c-0.5,0.1-0.9,0-1.3-0.3l-5-4.1l-6.2-1.2c-0.5-0.1-0.9-0.4-1.1-0.8l-1.6-3.3l-1.7-0.4l5,9.9l-0.4,0.1l0,0l-2.1-1.9
c-0.3-0.3-0.6-0.4-1-0.4" />
<polygon fill="url(#SVGID_76_)" points="161.8,406.9 157.3,403.9 156.2,405.6 162.1,415.9 162.7,414.5 " />
</a>
<a xlink:href="#" aria-label="bordeaux">
<linearGradient id="SVGID_51_" gradientUnits="userSpaceOnUse" x1="210.1601" y1="695.7123" x2="210.16" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_51_)" points="200.3,614.1 200.3,613.9 202.4,610.2 205.7,609.4 205.3,606.6 214.3,596.2 213.4,592.5
216.5,590.9 216,584.3 212.1,584.3 212.1,584.3 212.1,584.3 212.1,584.3 214.2,580.2 211.9,574.6 204.5,574.3 202.3,570.4
207.1,557.7 206.6,550 218.8,546.3 219.5,549.5 220.7,548.9 221,546.1 221,545 222.2,545.1 225.7,545.8 227.2,543.1 236.9,543.9
242.5,540.7 242.5,540.7 242.5,540.7 243.1,540.7 252.2,541.8 254.7,540.5 259,535 260.9,535.1 259.9,533.1 264.5,527.3
262.2,526.1 262.2,521.4 270.5,519.3 267.6,509.4 271.9,505.5 277.1,498.2 283.5,494.6 282.9,490.7 288.2,486.9 289.6,481.3
290.2,476.1 286.8,469 286.6,468.9 282.8,468.1 282.6,464.5 279.3,462.3 282,460 280,456.8 284,451.6 281.5,447.2 274,444.5
276.6,441.1 269.7,435.7 258.2,437 258.3,431.2 257.1,430.6 252.6,428.4 247.4,434.1 246.8,434.7 244.4,440.6 235.7,447.2
234.8,453.5 229.9,460.4 223.6,461.4 221.8,463 221.8,463.1 221.8,463.3 219.2,469.7 207.6,468.5 200.1,463.3 199.5,457
192.4,455.1 191.8,452.2 187.1,452.9 187.6,455.3 183.8,461.3 180.5,450.6 168.5,438.9 168.1,437.7 165.9,441.9 159.7,492.4
162.2,487.4 168.4,494.6 168.9,499.4 161.1,498.3 157.9,505.1 158,510.3 158,510.4 145.6,566.8 141.3,575 135.8,582.3 130.1,586.5
135.5,589 135.9,591.2 137.4,589.8 145.8,591.5 147.8,595.5 145.5,602.8 142.9,605.1 143.8,607.1 146.7,607.8 147.1,604.2
152.2,602.7 152.6,607.1 158.6,610.4 169.2,614.5 176.6,614.1 179.8,619.8 187.9,626.3 190.4,624.5 193.1,626.2 198.9,623.2
199.8,617 " />
</a>
<a xlink:href="#" aria-label="toulouse">
<linearGradient id="SVGID_52_" gradientUnits="userSpaceOnUse" x1="294.9315" y1="695.7123" x2="294.9315" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<path fill="url(#SVGID_52_)" d="M315.7,641.5l1.5-3.1l6.8-0.2l-3.6-4.2l-3.4,1.2l-4.7-2l-1.2-8l4.1-0.8l0.9-2.2l-3-3l2.9-3
l-0.2-2.8l-2.3-5.5l-9.7-4.3l-3-7.1l10.9-12.8l1.8,3.6l4.8-1.6l0.9-2l2.8,3.6l5.9,0.8l1.2-3.5l3.9-0.6l13.2,1.5l3.2-1.9l0.8-2.8
l-0.9-12.2l7.8,2.8c1.2-0.7,2.3-1.4,3.5-2.2c1.3-0.8,2.5-1.6,3.8-2.4l0.2-0.2l5.6,0.1l0.2-10l7.5,1.5l3.3-5.7l3.7-1l-0.3-1.2
l4.4-5.3l-5.1-2.5l-5.1-2.5h0l0,0l2.3-1l2.3-1l1.6-3.1l-9.8-4.7l-2.1-3.3l0.7-9.8l-3.2-9.5l-3.6-3.9l-0.2,0.5l-0.8-1.6l0,0l0,0
l-0.3-0.3v-0.3l-2.9-5.8l0.5-3.1l-2.5-1.6l-1.4-4.7l-5-3.9l-4.5,4.1l-3.4,10.1l-4.8,6.1l-7.3-1.9l-6.3,3.9l-4.5-6.8l2-6.5l-4-6.3
l0,0l-0.1-0.2l0-0.2l0,0l-1-5.4l-6.5-0.1l-6.3,3.2l-7.7-7l-8,0.7l-0.6,4.9l-1.6,6.4l-4.9,3.4l0.7,4.1l-7.3,4.1l-5.1,7.2l-3.4,3.1
l3.1,10.7l-8.7,2.3v1.9l3.3,1.8l-5.4,6.6l2,4.1l0,0v0l-4.3-0.4l-3.9,5l-3.5,1.7l-9.6-1.1l-5.6,3.2l-9.1-0.8l-1.5,2.9l-3.9-0.7
l-0.3,2.9l-4.4,2.4l-0.9-3.6l-8.6,2.6l0.5,6.5l-4.6,12.3l1.2,2.1l7.2,0.3l0.5,0.5l3,7.1l-1.1,2.1h2.5l0.7,9.8l-2.9,1.4l0.8,3.2
l-9.1,10.4l0.6,3.8l-4.3,1l-1.5,2.6l-0.4,2.6l-0.9,6.5l11.9,10.5l13.7-1.9l2.9,2.4l17.4,0.3l1.9-1.9l-0.4-7.6l3.7-1.9l19.3,5.7
l5.3,4.8l7.2-0.5l5.7,7.5l0.8-2.2l4.6-0.2l11.9,5.7L315.7,641.5z" />
</a>
<a xlink:href="#" aria-label="montpellier">
<linearGradient id="SVGID_59_" gradientUnits="userSpaceOnUse" x1="380.933" y1="695.7123" x2="380.933" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<path fill="url(#SVGID_59_)" d="M451.5,531.2l-2.4-4.2l-6.3-3.6h-2.4l-4.1,3.8l-0.2-3.9l-7,4.3l-9.5-6.1l-0.1-0.2l-7.9-16l0,0
l-0.1-0.2l-2.2-9.9l-9.6-8.2l-1.9-0.2l-0.2,3.3l-8.9-1.7l-1.7-6.7l-1.7-1.2l-8.9,7.6l-1.7-2l-6.8,15.8l4.5,4.8l3.4,10.3l-0.7,9.6
l1.5,2.3l11.2,5.3l-3,5.5l-1.3,0.6l8.6,4.2h0h0l-5.4,6.5l0.5,2.2l0,0v0l-4.7,1.2l-3.5,6.3l-6.5-1.3l-0.2,9.6l-7-0.1
c-1.2,0.7-2.4,1.5-3.6,2.2c-1.3,0.8-2.6,1.6-3.9,2.4l-0.4,0.2l-5.8-2l0.7,9.6l-1.2,3.8l-4.4,2.7l-13.6-1.5l-2.5,0.4l-1.4,3.9
l-8.3-1.2l-1.3-1.8l-7,2.3l-1.2-2.4l-8.1,9.6l2.2,5.3l9.7,4.3l2.7,6.5l0.2,4l-2.1,2.2l2.6,2.6l-1.9,4.4l-3.3,0.6l0.8,5l2.9,1.2
l4-1.4l7.2,8.4l-9.8,0.2l-1.3,2.7l-9.9,3l-1.4,3.8l9.2,2.8l2.5,6.3l2.6,0.1l4.9-4.5l4.1-0.2l0.1,0l10.8,2.4l5,3.9l5.8-0.4v-3
l9.8-5.2l7.4-1.3l7,1.9l-4.8-6l-0.4-20l0.5-11.4l6.6-12.4l3.1-3.2l6.4-4.7h7.6l7.3-8l12.4-9l10.1-2.8l0.5,0.5l0,0l0.2,0.2l3,5
l2.5,0.6l4.1-6.5l5.8-1.7l-0.9-2.7l5.5-6.3l3.2,0.9l2-11.1l9-9.7l-6.7-6.8l-0.2-6.2L451.5,531.2z" />
</a>
<a xlink:href="#" aria-label="aix-marseille">
<linearGradient id="SVGID_64_" gradientUnits="userSpaceOnUse" x1="499.4391" y1="695.7123" x2="499.439" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_64_)" points="505.2,566.2 507.1,565.7 506.8,565.2 505.2,562.2 505.3,561.9 505.3,561.8 505.6,561.2
505.7,561 505.9,560.6 505.9,560.6 505.9,560.6 505.9,560.6 505.9,560.6 507.2,560.6 512.2,560.9 515.8,558.6 520.1,563.9
531.3,554.6 537.4,558.3 538.6,554.9 550,554.4 552.4,553.3 551,550.6 557.9,545.5 561.4,545.9 555.3,539.1 550.3,529.2
552.7,522.5 559.1,515.3 561.2,509.8 556.6,503.3 559.5,500.9 561,494.4 561.4,493.8 563.8,491.1 566.7,491.2 563.3,482.7
556.8,482.4 550.4,478.2 549.6,471.2 546.7,471.1 544.2,465.4 538.3,466.5 535.9,469.1 527.5,465.2 526.2,468.2 528,472.3
533.1,475.9 532.6,484.3 528.1,482.8 514.8,486.8 513.7,490.1 507.6,491.4 506.7,494.2 506.3,498.8 499.7,499.2 497.3,505.4
501,508.1 496.9,512.3 492.5,510.7 489.5,515.2 490.8,517.5 502.3,524 502,530.6 500,531.1 497.8,531.2 492.8,536.7 485.8,533.7
485.6,530.7 475.1,529.7 474.7,524.4 472.8,526 469.9,524.3 460,528.8 455.7,523.8 450.8,523.2 450.8,525.4 451.2,526.6
453.3,530.3 453.6,530.8 453.6,530.8 453.7,531 453.9,537 461.4,544.6 451.5,555.3 449.2,568 445.1,566.8 441.2,571.3 442.4,574.9
435.3,577 432.1,581.9 446.9,582.3 449.7,585.8 449.2,588.4 452.3,589.1 461,588.2 459.4,586.5 461.5,582.4 465.6,582.9
470.7,588.9 485.8,587.1 490.3,597.2 500.4,599.7 502.8,599 503.2,595.7 505.8,593.7 503.4,587 505,583.1 507.2,582.8 501.5,573.4
501.5,573.4 501.5,573.4 502.2,571.5 504.1,566.5 " />
</a>
<a xlink:href="#" aria-label="nice">
<linearGradient id="SVGID_67_" gradientUnits="userSpaceOnUse" x1="552.5665" y1="695.7123" x2="552.5665" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_67_)" points="552.4,529 557,538 566.5,548.7 558.4,547.6 553.5,551.2 555.1,554.3 550.5,556.4
540.1,556.9 538.5,561.3 531.4,557 519.8,566.7 515.3,561.2 512.7,562.9 512.4,562.9 512.4,562.9 507.8,562.7 508.1,563.4
509.4,566 509.4,566 510,567.1 508.8,567.4 508.8,567.4 505.6,568.2 503.7,573.2 510.5,584.3 506.4,584.9 505.5,587 508.2,594.4
505.1,596.7 504.8,599.5 511.7,603.5 511.4,605.7 520.2,603.2 527.7,605.2 528.2,606.4 529.8,601.9 537.9,603.2 538,600.4
544.8,598.9 547.9,596 551.8,596.3 553.7,591.8 549.5,589.9 557.4,579.4 563.3,578.6 565.3,575.2 565.4,575.1 565.4,575.1
568.1,570.1 574.5,567.2 575.7,562.5 591.8,553.8 592.3,545.9 599.4,536.1 601.4,531.8 597.7,526.9 584.6,531.6 574.1,526
566.8,524.5 560.4,516.9 554.4,523.5 " />
</a>
<a xlink:href="#" aria-label="paris">
<linearGradient id="SVGID_72_" gradientUnits="userSpaceOnUse" x1="341.3066" y1="695.7123" x2="341.3066" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<path fill="url(#SVGID_72_)" d="M350.9,228.3l0.5-1.5h6.1l2.1,2.9v-3l-3.1-0.2l-5.4-2.3h-1.4l2.2-6.1v-3l-4.7-4.6l-5-2.3h-4.5v1.7
l-2.7,1.9l-2.8,2c-0.2,0.1-0.3,0.2-0.5,0.4l-0.2,0.1l-1.8,1.2h-4.2l-2.4,3l0,0l-0.1,0.3c-0.1,0.2-0.1,0.4,0,0.6l0.1,0.4l1.5,1.2
h5.1v2l4.8,1.8l4.2,4.2h5.2h1.6v-0.8L350.9,228.3L350.9,228.3z" />
</a>
<a xlink:href="http://www.google.fr" aria-label="corse">
<linearGradient id="SVGID_77_" gradientUnits="userSpaceOnUse" x1="558.429" y1="695.7123" x2="558.429" y2="160.7114" gradientTransform="matrix(1 0 0 -1 0 794.95)">
<stop offset="0" style="stop-color:#D96B6C" />
<stop offset="1" style="stop-color:#E35980" />
</linearGradient>
<polygon fill="url(#SVGID_77_)" points="579.3,641.9 574.7,635.4 575.3,623.3 573.5,613.7 571.3,613 569.5,614.6 570,634.8
559.8,633.2 556,638.4 544.2,643.2 543.1,646.5 539.8,646.9 537.8,649.4 538.2,653.2 533.7,658.9 533.4,660.2 535.3,659.5
540.8,665.6 534.5,670 535.5,675.2 545.4,680.6 541.4,683.3 538.9,690.4 546.1,687.8 547.4,695.7 544.8,702.8 556.5,705.1
549.5,709.9 549.4,712.2 554.3,716.7 567,720.6 568.4,723.7 570.6,724.6 576.2,710.3 571.3,709.7 576.1,706.2 578.2,700.5
577.4,683.9 583.4,670.6 " />
</a>
</g>
</svg>
</div>以上是关于html SVG自定义地图的主要内容，如果未能解决你的问题，请参考以下文章