#html #css #vue.js #svg
#HTML #css #vue.js #svg
Вопрос:
Я хочу перемещаться по изображению SVG и фокусировать текущий путь. Пути в изображении SVG представляют собой одну часть основного изображения. В моем приложении я хочу понять, что пользователь может выбрать с помощью взаимодействия с клавиатурой одну часть тела и отправить значение этой части тела.
import Footer from '../components/Footer'
export default {
name: "Localisation.vue",
components: {
Footer
}
}
.localisation{
display: grid;
height: 100vh;
width: 70%;
grid-template-rows: 70% 30%;
}
.bodyMap{
display: grid;
}
#Layer_1{
height: 400px;
width: 500px;
}
#Kopf{
}
.Kopf:focus{
fill: gray;
}
.rechtesOhr:focus{
fill: yellow;
}
.st0{fill:#FFFFFF;stroke:#000000;stroke-miterlimit:10;}
.st1{display:none;fill:#FFFFFF;}
<div class="localisation">
<div class="localisationLayout">
<div class="bodyMap">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
viewBox="0 0 322 981" xml:space="preserve">
<path id="Kopf" class="Kopf" d="M162.7,13.5c-4.3,0-7.5,0.6-9.5,1c-11.1,2.2-27.7,9.4-31.5,22.1c-0.6,2.2-0.9,4.5-1.2,7.5
c-0.5,4.4-0.4,7.4-0.2,15.2c0.2,9.6,0.1,7.6,0.2,11.6c0.7,21.7,1,32.5,3.4,37.7c4.5,9.7,12.5,15.8,17.9,19.9
c3.6,2.8,6.4,4.8,10.6,6.3c10.8,3.8,21.1,0.1,24.8-1.4c12.7-5.4,19.8-17.1,22.1-26.4c0.6-2.4,0.8-6.5,1.2-14.8
c0.2-5,0.2-7.4,0.5-23.8c0.1-3.5,0.1-5.3,0.1-6.1c0.6-22.2,2.2-22.4,1.2-26.6C199,22.3,178.6,13.6,162.7,13.5z"></path>
<path v-focus data-right='AUTOFOCUS'
data-left='AUTOFOCUS' id="rechtes_x5F_Ohr" class="rechtesOhr" d="M202.1,69.1c-0.3,0.2-0.8,0.7-1.2,4.7c-0.3,3.6-0.2,6.5-0.1,7.3c0.1,1.9,0.3,4.3,0.3,6.3
c0,0.1,0,0.6,0,1.3c0,0.6,0.1,1.4,0.2,2.6c0.2,1.9,0.3,2.3,0.6,2.4c0.7,0.4,2.4-0.6,3.2-2c1.4-2.3-0.5-4,0.6-7.1
c0.8-2.2,1.8-1.8,2.6-4.3c0.5-1.5,0.5-2.9,0.4-5.7c0-1.9-0.1-2.8-0.4-3.4C207.2,69,203.7,67.9,202.1,69.1z"></path>
<path v-focus data-right='AUTOFOCUS'
data-left='AUTOFOCUS' id="linkes_x5F_Ohr" class="st0" d="M120.2,69.1c0.9,0.7,0.9,2.1,0.8,5c-0.1,3.9-0.7,3.6-0.6,6.2c0.1,2.3,0.8,4.7,0.8,7.1
c0,1,0,1.9-0.2,3.9c-0.2,1.9-0.3,2.3-0.6,2.4c-0.7,0.4-2.4-0.6-3.2-2c-1.4-2.3,0.5-4-0.6-7.1c-0.8-2.2-1.8-1.8-2.6-4.3
c-0.5-1.5-0.5-2.9-0.4-5.7c0-1.9,0.1-2.8,0.4-3.4C115.1,69,118.7,67.9,120.2,69.1z"></path>
<path v-focus data-right='AUTOFOCUS'
data-left='AUTOFOCUS' id="Hals" class="st0" d="M125.9,112.3c0.7-0.2,1.6,2.6,5.3,6.9c1.9,2.2,3.5,3.5,6,5.6c5.3,4.4,7.9,6.6,11.5,8.3
c6.4,3.1,12.2,3.3,14.2,3.3c7,0.1,12.1-2.1,14.3-3.1c1.8-0.8,5.5-2.4,9.2-5.7c6.2-5.5,7.2-10.8,8.6-10.4c2.1,0.5,1.1,12-0.5,20.5
c-1.3,6.8-3,12-4.3,16c-0.8,2.5-2.6,6.9-6.1,15.6c-4.9,12.1-5.9,14.3-8.5,17c-1.7,1.7-4.6,4.7-9.5,5.9c-1.2,0.3-5.8,1.3-10.8-0.6
c-5.5-2.1-8.5-6.6-10.3-9.7c-11.3-19.5-16.4-42.2-16.9-44.5C125.4,123.6,124.5,112.6,125.9,112.3z"></path>
<path id="pp" class="st1" d="M140.4,192.5c1.4-1.3,2.7-2.6,4.1-3.9"></path>
<path class="st0" d="M147.4,186.5c2.2,2.4,4.3,3.5,5.7,4.1s2.7,0.9,4.5,1.3c1.8,0.4,3.3,0.7,4.4,0.9c-9-0.3-18.1-0.6-27.1-0.9
l-13.6-4.2l-12.6-3.8l-11-3.5c-15.3-3.1-18.9-5.7-18.9-7.5c0-1.9,3.8-2.4,13.2-6.9c13.2-6.3,12.6-8.7,20.3-11c1.3-0.4,3.8-1,6.8-2.5
c1.4-0.7,3.1-1.6,4-2.2c4.4-3.2,5-10.1,5.1-12.8c1.9,8.3,4.7,17.8,8.9,28.1C140.4,173.5,143.9,180.5,147.4,186.5z"></path>
<path class="st0" d="M176,187.9c-4.7,1.7-9.3,3.3-14,5c8.7-0.3,17.5-0.6,26.2-0.9l13.6-4.2l12.6-3.8l11-3.5
c19.8-2.3,24.1-4.4,24.1-5.9c0-1.7-5.8-2.3-18.4-8.5c-4.4-2.2-6.5-3.3-8.6-4.6c-5-3.1-6.3-4.8-11.7-6.4c-1.3-0.4-3.8-1-6.8-2.5
c-0.7-0.3-2.4-1.1-4-2.2c-1.6-1.1-4.3-3.4-6.5-7.5C187.7,157.8,181.8,172.9,176,187.9z"></path>
</g>
<path class="st0" d="M161,203.6l0.1,71.1c0,3.9-3.1,7-6.9,7c-3.4,0-7.3,0-11.6-0.2c-11.4-0.6-12.3-1.9-19.5-1.6
c-9.5,0.3-10.6,2.6-23.3,3.9c-8.9,0.9-13.4,1.2-17-0.8c-1.4-0.8-3.4-2.3-10.8-18.1c-6.2-13.4-6.3-15.4-5.9-17.2
c1-4.6,4-6.3,5.3-13.2c0.3-1.5,0.4-2.8,0.5-3.9c0,0,0.1-1.8-0.1-3.6c-0.6-6.9-8.5-50.3-2.4-52.6c0.6-0.2,0.8,0.2,3,0
c3.8-0.3,4.4-1.6,6.4-1.5c2.7,0.2,3.1,2.5,7,4.5c2.2,1.1,4.2,1.4,5.5,1.6c8.2,2.4,16.4,4.7,24.6,7.1c5.9,2.2,11.8,4.3,17.6,6.5
c2.1,0.1,4.3,0.1,6.7,0c2.3-0.1,4.4-0.3,6.4-0.6c1.8,0.3,3.7,0.6,5.5,0.9c1.4,0.6,3.2,1.2,4.9,0.6c1.3-0.4,1.7-1.1,2.6-1
c2,0.3,3.3,4,2.8,4.3c-0.2,0.2-0.8-0.6-1.3-0.4C160.5,196.5,160.3,198.4,161,203.6z"></path>
<path class="st0" d="M161.1,203.6l-0.1,71.1c0,3.9,3.1,7,6.9,7c3.4,0,7.3,0,11.6-0.2c11.4-0.6,12.3-1.9,19.5-1.6
c9.5,0.3,10.6,2.6,23.3,3.9c8.9,0.9,13.4,1.2,17-0.8c1.4-0.8,3.4-2.3,10.8-18.1c6.2-13.4,6.3-15.4,5.9-17.2c-1-4.6-4-6.3-5.3-13.2
c-0.3-1.5-0.4-2.8-0.5-3.9c0,0-0.1-1.8,0.1-3.6c0.7-7.5,11-47.3,2.6-52.6c-1-0.6-1.5-0.3-16.9,3.4c-4.6,1.1-8.4,2-10.6,2.6
c-5.3,1.6-10.5,3.3-15.8,4.9c-5.2,1.6-10.4,3.2-15.6,4.8c-3.2,0.8-6.9,1.6-11.1,2c-2.7,0.3-5.2,0.3-7.5,0.3c-3.1,0-6.1,0-9.2-0.1
c-2.7-0.6-3.8,0.2-4.2,0.5c-0.8,0.8-0.8,1.8-0.9,7C161.1,200.6,161.1,201.9,161.1,203.6z"></path>
<path class="st0" d="M69.4,174.4c-3.2,0.1-8,0.6-13.4,2.6c-3.2,1.2-8.4,3.3-13,8.1c-3.8,4-5.3,7.9-7.1,13c-0.7,1.8-2.2,6.2-4.3,21.3
c-1.6,11.5-2.3,17.3-1.4,21.3c1.4,6.2,3.7,7.6,4.3,13.8c0.5,5.7-0.9,9.8-2.2,14.2c0,0-5.3,17.5-6.9,35.9c-0.5,6-1.7,19.5,2.4,20.9
c1.9,0.6,3.2-1.7,6.3-3.2c11.6-5.9,25.9,10.4,32.9,5.9c4-2.6,0.3-8.9,2.8-26.2c2.1-14.3,5.2-14.5,4.5-22.1
C73,267,63.7,264.3,62.7,252.7c-0.4-4.9,7.7-9.7,7.5-21.1"></path>
<path class="st0" d="M252.9,174.4c3.2,0.1,8,0.6,13.4,2.6c3.2,1.2,8.4,3.3,13,8.1c3.8,4,5.3,7.9,7.1,13c0.7,1.8,2.2,6.2,4.3,21.3
c1.6,11.5,2.3,17.3,1.4,21.3c-1.4,6.2-3.7,7.6-4.3,13.8c-0.5,5.7,0.9,9.8,2.2,14.2c0,0,5.3,17.5,6.9,35.9c0.5,6,1.7,19.5-2.4,20.9
c-1.9,0.6-3.2-1.7-6.3-3.2c-11.6-5.9-25.9,10.4-32.9,5.9c-4-2.6-0.3-8.9-2.8-26.2c-2.1-14.3-5.2-14.5-4.5-22.1
c1.3-12.9,10.6-15.6,11.6-27.2c0.4-4.9-7.7-9.7-7.5-21.1"></path>
<path class="st0" d="M27.8,325.5c-2.3,2.3-1.3,6.1-1,10.2c0.8,12.4-5.5,24.1-5.5,24.1c-1.9,15.3-3.1,24.9-3,39.2
c0.1,13.1,1.1,11.7,1.6,31.7c0.4,15,0.5,22.6-0.4,29c-2,13.4-5.4,17.7-2.4,21.5c5,6.5,22.2,4.3,25.4-2.4c1-2.2-0.1-3.6,0-9.1
c0.1-4.2,0.9-7.5,2.6-13.4c3.4-11.4,7.2-21,7.9-22.9c5.9-15.2,8.8-22.7,9.5-25.6c2.4-9.4,2.6-16.4,3-27c0.2-4.9,0.9-22.7-2.4-23.3
c-1.4-0.2-2.7,2.5-3.2,2.2c8.6-24.4,8.8-30.7,7.1-31.5c-1-0.5-2.5,0.8-6.2,0.2c-0.6-0.1-1.9-0.3-4.7-1.5c-4.2-1.8-4.6-2.6-7.6-3.9
c-2.7-1.2-5.3-2.3-8.6-2c-1.9,0.1-3.7,0.8-7.4,2.3C29.8,324.3,28.5,324.8,27.8,325.5z"></path>
<path class="st0" d="M294.5,325.5c2.9,3,2.3,7.9,2.1,10.2c-0.4,5.2,0.3,13.1,5.5,24.1c1.9,15.3,3.1,24.9,3,39.2
c-0.1,13.1-1.1,11.7-1.6,31.7c-0.4,15-0.5,22.6,0.4,29c2,13.4,5.4,17.7,2.4,21.5c-5,6.5-22.2,4.3-25.4-2.4c-1-2.2,0.1-3.6,0-9.1
c-0.1-4.2-0.9-7.5-2.6-13.4c-3.4-11.4-7.2-21-7.9-22.9c-5.9-15.2-8.8-22.7-9.5-25.6c-2.4-9.4-2.6-16.4-3-27
c-0.2-4.9-0.9-22.7,2.4-23.3c1.4-0.2,2.7,2.5,3.2,2.2c-9.2-24.2-9.8-30.7-8.2-31.5c0.8-0.4,2.2,0.8,5.2,0.5c1.7-0.2,2.5-0.6,5.8-2.2
c4.5-2.1,6.7-3.2,9-4c2.6-0.9,4.1-1.4,6.3-1.5c2.7-0.1,4.8,0.6,6.6,1.3C290.8,323.2,293,323.9,294.5,325.5z"></path>
<path class="st0" d="M17.1,481.2c-0.4,0.2-1.2,1-0.3,11c0.3,2.8,0.5,4.6,0.6,5.9c0.7,6.2,1,10,0.8,14.4c-0.5,8.8-3,11.9-0.6,16.2
c1,1.9,1.7,1.6,3.2,4.3c2.2,3.6,1.6,5.1,3.2,9.9c1.3,3.5,2.7,7.4,6.3,10.1c1.8,1.3,2.6,1.1,5.3,2.4c3.1,1.5,8.8,6.8,9.1,7.1
c7.3,7.8,11.4,11.6,15,11c4.2-0.7,7.4-7.4,7.1-13s-4.2-9.5-7.9-13.2c-5.8-5.8-8.3-4.9-13.4-10.8c-2.8-3.2-6.2-7.3-5.5-12.2
c0.5-3.4,3.1-7.1,5.3-6.9c1.7,0.1,2.3,2.6,7.3,12.4c2.1,4.1,3.5,6.6,6.5,8.3c0.8,0.5,3.7,2.2,5.5,1c1.8-1.2,1.1-4.7,0.8-6.7
c-0.3-1.6-1.1-4.9-3.8-8c-1.6-1.8-2-1.4-2.6-2.6c-1.4-2.6,0.1-4.7,0-9c0-1.7-0.4-3.1-1.1-5.9c-1.1-4.3-2.7-7.9-5.5-13.4
c-4.2-8.2-7.9-15.3-9.9-14.7c-0.7,0.2-0.6,1-2,2.4c-0.3,0.3-1.3,1.3-4.1,2.3c-3.7,1.4-6.9,1.6-8.3,1.6c-2.5,0-4.2,0-6.2-0.8
C18.8,483,18.1,480.8,17.1,481.2z"></path>
<path class="st0" d="M306.3,481.2c1.1,0.4-0.1,4.9-0.7,13.5c0,0-0.1,1.6-0.3,4.8c-0.5,9.5-0.8,14.2-0.8,14.4
c0.5,8.8,3,11.9,0.6,16.2c-1,1.9-1.7,1.6-3.2,4.3c-2.2,3.6-1.6,5.1-3.2,9.9c-1.3,3.5-2.7,7.4-6.3,10.1c-1.8,1.3-2.6,1.1-5.3,2.4
c-3.1,1.5-8.8,6.8-9.1,7.1c-7.3,7.8-11.4,11.6-15,11c-4.2-0.7-7.4-7.4-7.1-13s4.2-9.5,7.9-13.2c5.8-5.8,8.3-4.9,13.4-10.8
c2.8-3.2,6.2-7.3,5.5-12.2c-0.5-3.4-3.1-7.1-5.3-6.9c-1.7,0.1-2.3,2.6-7.3,12.4c-2.1,4.1-3.5,6.6-6.5,8.3c-0.8,0.5-3.7,2.2-5.5,1
c-1.7-1.1-1.6-4.4-0.8-6.7c1.3-3.9,4.4-3.8,6.7-8.3c1.2-2.3,1.4-4.3,1.6-6.6c0.5-4.8-0.6-7.1-0.8-10.6c-0.3-4.5,1.1-7.8,3.4-13.3
c3.1-7.5,9.2-17.2,12.7-16.3c1.3,0.4,1.1,1.8,3.6,3.6c1.8,1.2,3.4,1.6,5.6,2.1c3.7,0.8,6.6,0.6,7.7,0.5c2-0.2,3.4-0.4,5-1.2
C305.2,482.5,305.7,481,306.3,481.2z"></path>
<path class="st0" d="M160.3,277.9c0.6,7.2,0.9,15.1,0.7,23.6c-0.1,4.6-0.3,9.1-0.7,13.3c-0.1,20,0.5,26.9,1.1,28.7
c0.5,1.5,0.5,2.6,0.4,4.7c0,0.4-0.1,1.2-0.6,1.6c-0.2,0.1-0.4,0.2-1.5,0.2c-1.1,0.1-1.7,0.1-2,0.1c-0.9-0.1-1-0.2-1.7-0.3
c-1.5-0.2-1.8,0.3-3.6,0.4c-0.3,0-0.9,0-2-0.1c-1.4-0.1-1.8-0.2-3.2-0.3c-1-0.1-1.5-0.1-2.2-0.1c-1.7,0-2.1,0.2-3.3,0.1
c-1.5,0-1.7-0.3-3.6-0.6c-0.9-0.1-2.3-0.3-4.1-0.3c-0.7,0-1.7,0-2.8,0c-1.2,0-1.8,0-2.3,0c-1.5,0.1-1.7,0.3-2.8,0.3
c-0.6,0-1.5,0-2.6-0.3c-0.5,0-1.2,0-2.1-0.1c-1.5,0-1.8,0-2.8-0.1c-0.7,0-1.5-0.1-2.5-0.2c-1.2-0.2-1.2-0.2-2-0.3
c-1.1-0.1-1.2,0-2.9,0c-1.1,0-2-0.1-2.2-0.1c-1-0.1-1.5-0.1-2.1-0.2c-0.9-0.2-1.3-0.4-2.2-0.4c-0.2,0-0.5,0-1,0.1
c-1.8,0.2-1.7,0.2-2.3,0.2c-1.1,0-1.2-0.3-2.2-0.3c-0.6,0-1.1,0.2-1.4,0.3c-0.8-0.4-1.5-0.5-1.9-0.5c-0.5,0-0.9,0.1-1.6,0
c-0.5-0.1-0.5-0.1-0.9-0.1c-0.8-0.1-1.4,0.3-1.6,0.3c-2.5,0.7-8.4-18.3-8.4-18.3c-3.2-10.4-4.5-14.2-5.1-19.7
c-1-8.7,0.1-11.3,0-15.8c-0.1-2.1-0.4-3-0.8-5.5c-0.9-5.4-1.6-13.3-0.6-13.6c0.9-0.2,1.4,5.7,6.1,8.6c2.1,1.3,4.2,1.4,8.2,1.5
c3.5,0.1,6.7-0.2,11.6-1c8.5-1.4,8.5-2.3,14.6-3c5.3-0.7,9.6-0.5,11.4-0.4c2.6,0.1,3,0.3,10.2,1.2c10.6,1.4,12.8,1.4,15.5,0.5
C157,280.7,159.1,279.1,160.3,277.9z"></path>
<path class="st0" d="M92.3,384.1c-0.4-1.4-0.8-2.7-1.1-4.1c-1.8,5.2-2.7,8.2-3.1,10c-0.1,0.5-0.7,3-1.6,5.5
c-0.9,2.6-1.2,3.1-1.8,4.9c-1.8,5.5-1.7,10.2-1.6,12.8c0.1,5,0.2,15.5-1.6,23.9c-1.3,5.9-2.8,7.2-5.3,12.1c-1.3,2.5-2.1,4.5-3.6,8.6
c-1.2,3.2-8,21.5-4.4,23.6c0.9,0.5,1.8-0.4,9-4.5c5.5-3.1,8.3-4.7,9.9-5.1c3.1-0.8,7.3-0.1,15.5,1.5c4.1,0.8,4.4,1,12.1,2.5
c5.5,1.1,7.3,1.4,9.7,1.5c3.3,0.3,6.4,0.5,9.6-0.1c2.2-0.4,3.7-1.1,12.9-7.8c0.8-0.6,9.6-7,13.6-13.5c0.5-0.7,1.3-2.1,0.8-3.2
c-0.8-1.7-4.2-1.7-5.1-1.7c-9.5-0.2-26.2-12.3-36-20c-3-2.3-7.1-6.1-11-12c-1.2-1.7-2.6-3.8-4.1-6.2c0,0-1.8-2.9-3.5-6.1
C97,398.2,92.5,384.9,92.3,384.1z"></path>
<path class="st0" d="M232.7,382.7c1.7,3.2,2.5,5.6,3,7.3c0.2,0.7,0.7,3,1.6,5.5c0.9,2.6,1.2,3.1,1.8,4.9c1.8,5.5,1.7,10.2,1.6,12.8
c-0.1,5-0.3,15.5,1.6,23.9c1.9,8.4,4.1,7.5,8.9,20.7c1.5,4.1,7.2,19.7,4.1,21.5c-1.9,1.1-5.4-3.4-9.5-6.3
c-16.5-11.7-36.1,7.9-59.5,0.6c-12.4-3.8-23.7-14.3-22.3-21c1.5-7.6,18.6-6.1,37.6-20.3c7.5-5.6,12.5-11.6,15.3-15.4
c0.9-1.4,2.1-3.2,3.5-5.4c0.8-1.4,3.2-5.4,5.7-10.8C228.1,396.3,230.6,390.2,232.7,382.7z"></path>
<path class="st0" d="M162.9,445.9c-0.5,1.9-1,3.8-1.4,5.7c-0.3,1.4-0.7,2.8-1,4.2c-0.7,1.1-1.7,2.5-3,4.1c-1,1.2-3.1,2.6-5.9,5.8
c-0.6,0.7-11.2,8.3-10.3,7.6c-4,1.4-6.2,1.5-6.5,2.8c-0.4,1.9,3.7,2.9,6.1,7.3c1.7,3.1,1,4.8,1.8,9.5c1,5.5,1.9,10.6,5.1,14.4
c3.7,4.4,11,7.6,17.9,5.7c9.5-2.6,12.4-13.1,12.6-13.8c1.6-6-1.3-8.2,1.4-12.6c2.8-4.5,3.2-7.3,5.9-9.3c0.7-0.6,1.9-1.3,1.8-2.2
c-0.1-1.2-2.4-1.7-4.7-2.4c-0.5-0.2-10.7-3.7-16.2-11.4c-0.2-0.3-0.5-0.7-0.8-1.2C162.5,454.9,162.5,449.4,162.9,445.9z"></path>
<path class="st0" d="M68.1,481.4c-6.5,1-0.2,38.8-0.2,38.8c5.3,31.8-0.2,24.2,5.3,58.8c6,38.1,9.9,29,18.1,72.4
c2.1,11.2,4.5,25.8,9.9,26.4c4,0.4,4.7-7.1,12.6-12.4c13.9-9.2,31.4,0.8,36.1-6.9c1.2-2,0.6-3.5,0.2-8.3
c-0.8-10.2,1.1-15.9,3.4-28.6c2.4-13.1,3.5-26.4,5.3-39.6c2.7-19.9,1.6-30.3,3-39.6c0.3-1.8,0.8-4.5,0.8-8.3c0.1-3.4-0.2-4.1-0.1-8
c0.1-2.2,0.3-3.1,0.4-6.3c0.2-4.9,0-5.8-0.7-6.3c-1.1-1-2.6-0.3-5.1-0.5c-3.5-0.4-5.9-2.5-7.5-3.8c-6.1-5.2-7-15.2-7.2-17.4
c-0.3-2.9-0.1-5.3-1.6-8.3c-0.9-1.8-2.2-4.3-4.6-5c-1.4-0.4-4.8-0.6-6.1-0.9c-0.1,0-0.3-0.1-0.5-0.1c-2.5-0.5-2.9,0-6.5-0.2
c-3.9-0.2-5.8-0.9-10.8-2c-1-0.2-7.3-1.7-14.2-2.6c-7-1-10.5-1.4-13.6-0.2c-2.4,0.9-5.4,2.1-7.5,4.5c-0.5,0.5-1.8,2-3.9,3
c-0.9,0.5-1.9,0.8-2,0.8C70.2,480.9,69.1,481.2,68.1,481.4z"></path>
<path class="st0" d="M255.3,479.3c0,0,3.7,1.8,3.8,21.9c-0.8,9.6-2.4,19-2.4,19c-5.3,31.8,0.2,24.2-5.3,58.8
c-6,38.1-9.9,29-18.1,72.4c-2.1,11.2-4.5,25.8-9.9,26.4c-4,0.4-4.7-7.1-12.6-12.4c-13.5-9-30.2,1.3-36.1-6.9c-1.3-1.7-1-3-1.4-8.5
c-0.9-12.6-2.6-15-4.7-28.8c-0.5-3.1-0.8-5.8-1-8.3c-1.3-13-1.5-23.3-1.8-30.9c-0.7-19.6-3.7-50.6-3.2-57.8c0.1-2,0.6-3.3,0.6-6.4
c0-2.1-0.3-3.4,0.5-4.4c0.9-1,2.2-0.4,3.7-1c4.9-2,7.5-6.1,8.4-7.6c1.8-2.9,2.4-5.5,2.9-7.6c1.2-5.3-0.6-6.6,1-10.7
c0.5-1.3,0.6-1,3-5.6c0.7-1.4,1-2,1.7-2.6c0.8-0.7,1.6-0.9,2.3-2c0.5-0.7,0.3-0.9,0.7-1.3c0.8-0.8,2.2-0.5,4.8-0.2
c0.8,0.1,2.9,0.3,5,0.4c1.8,0,3.3-0.1,4.5-0.2c2-0.2,3.6-0.4,5-0.7c3.9-0.7,6.8-1.5,8.5-1.9c6-1.6,9.1-2.3,11.3-2.7
c4.9-0.7,9.9-1.4,14.8,0.7c4.1,1.8,6.4,3.9,6.4,3.9c1.1,0.9,1.8,1.9,3.4,3C252.8,478.5,254.3,479,255.3,479.3z"></path>
<path class="st0" d="M124,663.6c-1.5-0.1-4.3-0.1-7.3,1.2c-2.9,1.3-4.6,3.3-5.9,4.9c-2.5,3.1-2,4-4.9,7.9c-2.5,3.4-3.3,3.1-3.9,4.9
c-0.9,2.8,0.7,4.4,2,9.9c0.5,2.1,0.8,4.1,1.2,8.1c0.8,6.7,1.2,10.1,0.6,12.6c-1.3,5.6-5,9.1-3.7,10.6c0.6,0.6,1.4,0.1,2.4,0.8
c1.6,1.1,1.6,3.4,1.8,5.9c0.2,2.9,0.8,7,1.2,8.3c2.7,7.9,32.3,11.5,41-0.8c0.9-1.3,1.7-4.3,3.2-10.3c2.6-10.3,3.9-18.3,4.3-20.9
c1.9-12.9,2.9-19.4,2.2-26.4c-0.7-7.6-2.5-8.9-4.5-18.1c-2-9.3-2.6-18.1-2.2-26.2"></path>
<path class="st0" d="M197.9,663.6c1.5-0.1,4.3-0.1,7.3,1.2c2.9,1.3,4.6,3.3,5.9,4.9c2.5,3.1,2,4,4.9,7.9c2.5,3.4,3.3,3.1,3.9,4.9
c0.9,2.8-0.7,4.4-2,9.9c-0.5,2.1-0.8,4.1-1.2,8.1c-0.8,6.7-1.2,10.1-0.6,12.6c1.3,5.6,5,9.1,3.7,10.6c-0.6,0.6-1.4,0.1-2.4,0.8
c-1.6,1.1-1.6,3.4-1.8,5.9c-0.2,2.9-0.8,7-1.2,8.3c-2.7,7.9-32.3,11.5-41-0.8c-0.9-1.3-1.7-4.3-3.2-10.3
c-2.6-10.3-3.9-18.3-4.3-20.9c-1.9-12.9-2.9-19.4-2.2-26.4c0.7-7.6,2.5-8.9,4.5-18.1c2-9.3,2.6-18.1,2.2-26.2"></path>
<path class="st0" d="M102.1,723.7c1,0,2.8,1.1,3.7,2.7c0.9,1.6,0.7,3.2,0.5,4c0.1,1.4,0.2,2.6,0.4,3.6c0.1,0.9,0.2,1.6,0.4,2.9
c0.2,1.2,0.3,1.4,0.4,1.8c0.1,0.2,0.4,1.1,1.4,2.1c0.2,0.2,1,1,3,2c1.6,0.8,2.9,1.2,4,1.5c1.7,0.5,3.1,0.8,4,0.9
c0.8,0.1,2.7,0.5,5.2,0.6c4.1,0.2,7.2-0.2,7.9-0.3c1.6-0.2,3.5-0.5,6-1.3c1.8-0.6,3.5-1.2,5.3-2.4c3.5-2.5,4.2-5.6,5-5.4
c0.9,0.3-0.6,4.8-0.3,12c0.1,2.2,0.2,1.9,0.6,6.7c0.4,5.2,0.4,7.6,0.5,9.5c0.5,6.5,3.4,10.7,4.9,14.8c3.2,8.6,3.5,16.4,3.9,25.8
c0.4,9.9-0.7,17.7-3,33.3c-1.6,10.7-2.3,9.8-3,14.2c-0.2,1.1-0.3,2.4-1.2,3.9c-0.8,1.2-1.6,1.9-1.4,2.2c0.3,0.5,2.3-0.8,3.9,0
c0.9,0.5,1.4,1.5,1.8,3.7c0.9,4.6,0.4,7.7,0.4,7.7c-0.9,5.6-0.3,11.4-1,17c-2.1,17.5-3.1,26.2-2.4,30c1.9,10.3,4.3,17.7,4.3,17.7
c1.7,5.3,2.6,6.6,1.8,8.3c-3,7.3-26.3,7.1-29.2,0.2c-0.4-0.9-0.2-2.3,0.2-5.1c0.8-5.7,2.3-9.2,3-11.8c1.2-4,0.9-7.5,0.4-14.4
c-1-14-4.8-25.6-5.5-27.8c-4.7-14.2-8.6-20.7-15-34.5c-7.4-16.1-12.9-27.9-16.8-43.4c-5.6-22.2-5-39.8-4.3-47.9
C93.2,740.9,98.1,723.6,102.1,723.7z"></path>
<path class="st0" d="M221.1,724.9c-0.4-0.7-1-1-1-1c-0.5-0.2-1-0.1-1.3,0c-0.4,0-1,0.2-1.4,0.6c-0.1,0.1-0.2,0.2-0.4,0.4
s-0.6,0.7-0.8,1.3c-0.1,0.3-0.2,0.5-0.3,1s-0.2,0.9-0.2,2c0,0.6-0.1,0.9-0.1,1.3c-0.1,0.9-0.3,3.5-0.6,5c-0.3,1.4-0.8,4.2-3,6.2
c-1,0.9-1.9,1.2-3.9,2c-0.7,0.3-2.5,0.9-5.4,1.5c-3.5,0.7-6.5,0.8-8.1,0.8c-2,0-4.8,0-8.3-0.8c-3.2-0.7-6-1.3-8.7-3.3
s-3.6-4.2-4.2-3.9c-0.7,0.4,1.5,4.2,1.7,10.1c0.1,2.4-0.5,4.1-0.8,7.7c-0.2,2.3-0.8,4.6-2,8.9c-2.2,7.6-4.4,13.5-4.9,14.8
c-3.2,8.6-3.5,16.4-3.9,25.8c-0.4,9.9,0.7,17.7,3,33.3c1.6,10.7,2.3,9.8,3,14.2c0.2,1.1,0.3,2.4,1.2,3.9c0.8,1.2,1.6,1.9,1.4,2.2
c-0.3,0.5-2.3-0.8-3.9,0c-0.9,0.5-1.4,1.5-1.8,3.7c-0.9,4.6-0.4,7.7-0.4,7.7c0.9,5.6,0.3,11.4,1,17c2.1,17.5,3.1,26.2,2.4,30
c-1.9,10.3-4.3,17.7-4.3,17.7c-1.7,5.3-2.6,6.6-1.8,8.3c3,7.3,26.3,7.1,29.2,0.2c0.4-0.9,0.2-2.3-0.2-5.1c-0.8-5.7-2.3-9.2-3-11.8
c-1.2-4-0.9-7.5-0.4-14.4c1-14,4.8-25.6,5.5-27.8c4.7-14.2,8.6-20.7,15-34.5c7.4-16.1,12.9-27.9,16.8-43.4
c1.2-4.7,5.8-23.6,4.3-47.9C230.5,758.5,230.6,742.8,221.1,724.9z"></path>
<path class="st0" d="M129.6,942c-2.1,0-2.6,3.8-6.3,8.9c-1.7,2.4-5,6.9-10.3,9.5c-5.2,2.6-8.1,1.1-10.8,4.3
c-0.2,0.2-2.8,3.4-1.8,6.3c1.4,4.1,9.3,4.7,14.2,5.1c9.1,0.7,10.4-1.6,19.9-0.8c5.3,0.4,6.4,1.3,11,1c5-0.3,10.3-0.6,12.6-4.5
c2.2-3.7,1-9.8-2-12.2c-1-0.8-1.9-0.9-2.4-2c0-0.1-0.1-0.2-0.1-0.3c-0.6-2.2,1.9-6.2,1.9-6.2c1.1-1.7,2.4-4.3,3.5-7.9
c-2.8,2-7.6,4.8-13.9,5.4c-3.4,0.3-7.1,0.7-10.3-1.5C131.6,945,131.4,942.1,129.6,942z"></path>
<path class="st0" d="M192.5,943.4c2.2-0.1,3.4,3.3,6.5,7.5c1.8,2.5,5.2,6.9,10.3,9.5c5.2,2.6,8.1,1.1,10.8,4.3
c0.2,0.2,2.8,3.4,1.8,6.3c-1.4,4.1-9.3,4.7-14.2,5.1c-9.1,0.7-10.4-1.6-19.9-0.8c-5.3,0.4-6.4,1.3-11,1c-5-0.3-10.3-0.6-12.6-4.5
c-2.2-3.7-1-9.8,2-12.2c1-0.8,1.9-0.9,2.4-2c0-0.1,0.1-0.2,0.1-0.3c0.6-2.2-1.9-6.2-1.9-6.2c-1.1-1.7-2.4-4.3-3.5-7.9
c1.5,1.4,4.1,3.5,7.8,4.7c4.9,1.6,9.1,0.8,11.1,0.4c2.2-0.4,4.5-0.9,7-2.6C191.1,944.4,191.4,943.5,192.5,943.4z"></path>
<path class="st0" d="M91.2,347.3c-1.1,0.8-0.2,3.5,0.4,6.1c1.3,5.8,0.9,10.9,0.2,18.2c-0.4,4-0.7,4.5-0.6,7c0.2,3,0.9,5.1,2.3,9.3
c1.3,4,2.6,7,3.3,8.7c0.7,1.6,2.2,4.8,5.1,10.2c4.4,8,6.5,12,10.1,16.3c2.9,3.5,5.5,5.8,8.1,8c5.2,4.5,9.5,7.3,13.3,9.7
c3.7,2.4,9.5,5,21.3,10.2c1.5,0.6,4.4,1.9,6.3,0.6c0.4-0.3,1.1-0.9,1.7-3.4c0.8-3.1,0.4-5.1,0.4-7.8c0-2.4,0.3-1.6,1.1-8.2
c0.6-4.8,0.9-8.5,0.9-9.3c0.3-3.8,0.3-6.7,0.3-9.1c0.1-3.2,0-5.6,0-7.3c0-3.4-0.1-6.1-0.2-7.8c-0.1-2-0.2-3.6-0.2-4.6
c-0.1-2.6-0.2-4.6-0.3-5.9c-0.2-2.5-0.3-4.4-0.4-5.8c-0.2-2.3-0.3-4.1-0.4-5.5c-0.1-0.9-0.2-2.5-0.4-5.5c-0.1-1-0.2-2.5-0.7-8.1
c-0.7-8.8-0.7-8.6-0.7-8.9c-0.1-3,0-3.1-0.3-3.6c-1.5-2.4-6.1-0.9-14.8-1c-5.1-0.1-4.2-0.6-11.4-0.9c-6-0.2-6.2,0.1-13.2,0
c-3.2-0.1-7.5-0.2-12.9-0.7c-4.7-0.4-6.4-0.8-9.5-0.6c-2,0.1-3.1,0.3-5.2,0.1C92.7,347.3,91.9,346.9,91.2,347.3z"></path>
<path class="st0" d="M167.4,281.9c2.7,0.9,4.9,0.9,15.5-0.5c7.2-0.9,7.6-1.1,10.2-1.2c1.8-0.1,6.1-0.3,11.4,0.4
c6.1,0.7,6.1,1.6,14.6,3c4.9,0.8,8.1,1.1,11.6,1c4-0.1,6.1-0.2,8.2-1.5c4.7-2.9,5.2-8.8,6.1-8.6c1,0.3,0.3,8.2-0.6,13.6
c-0.4,2.5-0.7,3.4-0.8,5.5c-0.1,4.5,1,7.1,0,15.8c-0.9,8-3.2,11.1-5.1,19.7c-2.1,9.2-2.1,17.9-4.8,18.2c-0.9,0.1-3.9-0.5-5.3-0.2
c-0.1,0-0.4,0.1-0.9,0.1c-0.7,0.1-1.1,0-1.6,0c-0.4,0-1.1,0.1-1.9,0.5c-0.3-0.1-0.8-0.3-1.4-0.3c-1-0.1-1.1,0.3-2.2,0.3
c-0.5,0-0.4-0.1-2.3-0.2c-0.6,0-0.8-0.1-1-0.1c-0.9,0-1.2,0.2-2.2,0.4c-0.6,0.1-1.1,0.2-2.1,0.2c-0.3,0-1.1,0.1-2.2,0.1
c-1.7,0-1.9-0.1-2.9,0c-0.8,0.1-0.7,0.1-2,0.3c-1,0.1-1.8,0.2-2.5,0.2c-1,0-1.2,0-2.8,0.1c-0.9,0-1.6,0.1-2.1,0.1
c-1.1,0.3-2,0.3-2.6,0.3c-1.1,0-1.3-0.2-2.8-0.3c-0.5,0-1.1,0-2.3,0c-1.1,0-2,0-2.8,0c-1.7,0-3.1,0.1-4.1,0.3
c-1.9,0.3-2.1,0.6-3.6,0.6c-1.2,0-1.6-0.2-3.3-0.1c-0.7,0-1.2,0.1-2.2,0.1c-1.4,0.1-1.7,0.2-3.2,0.3c-1.1,0.1-1.7,0.2-2,0.1
c-1.9,0-2.2-0.5-3.6-0.4c-0.8,0.1-0.8,0.2-1.7,0.3c-0.3,0-0.9,0-2-0.1s-1.3-0.1-1.5-0.2c-0.5-0.4-0.6-1.1-0.6-1.6
c-0.1-1.6-0.1-2.5,0-3.5c0.1-0.6,0.3-1.1,0.3-1.1c1.1-3.3,0.1-25,0-29.9c0-1.1,0-0.1,0.4-12.1c0.3-10.1,0.6-18.3,0.7-23.6
C162.7,279.1,164.8,280.7,167.4,281.9z"></path>
<path class="st0" d="M233.8,347.3c1.1,0.8,0.2,3.5-0.4,6.1c-1.3,5.8-0.9,10.9-0.2,18.2c0.4,4,0.7,4.5,0.6,7c-0.2,3-0.9,5.1-2.3,9.3
c-1.3,4-2.6,7-3.3,8.7c-0.7,1.6-2.2,4.8-5.1,10.2c-4.4,8-6.5,12-10.1,16.3c-2.9,3.5-5.5,5.8-8.1,8c-5.2,4.5-9.5,7.3-13.3,9.7
c-3.7,2.4-9.5,5-21.3,10.2c-1.5,0.6-4.4,1.9-6.3,0.6c-0.4-0.3-1.1-0.9-1.7-3.4c-0.8-3.1-0.4-5.1-0.4-7.8c0-2.4-0.3-1.6-1.1-8.2
c-0.6-4.8-0.9-8.5-0.9-9.3c-0.3-3.8-0.3-6.7-0.3-9.1c-0.1-3.2,0-5.6,0-7.3c0-3.4,0.1-6.1,0.2-7.8c0.1-2,0.2-3.6,0.2-4.6
c0.1-2.6,0.2-4.6,0.3-5.9c0.2-2.5,0.3-4.4,0.4-5.8c0.2-2.3,0.3-4.1,0.4-5.5c0.1-0.9,0.2-2.5,0.4-5.5c0.1-1,0.2-2.5,0.7-8.1
c0.7-8.8,0.7-8.6,0.7-8.9c0.1-3,0-3.1,0.3-3.6c1.5-2.4,6.1-0.9,14.8-1c5.1-0.1,4.2-0.6,11.4-0.9c6-0.2,6.2,0.1,13.2,0
c3.2-0.1,7.5-0.2,12.9-0.7c4.7-0.4,6.4-0.8,9.5-0.6c2,0.1,3.1,0.3,5.2,0.1C232.3,347.3,233.1,346.9,233.8,347.3z"></path>
<path class="st0" d="M134.6,45.7c0.8-0.6,6.1-4.6,11.6-4.1c2.7,0.3,4.7,1.5,4.7,1.5c1.4,0.9,2.4,1.9,2.9,2.6"></path>
<path class="st0" d="M167.9,45.2c2.5-1.5,4.8-2.2,6.4-2.6c1.6-0.4,3-0.8,4.9-0.6c2.9,0.3,5.1,1.6,6.4,2.6"></path>
<path class="st0" d="M143.7,51.7c-1.9,0.2-2.9,2.9-3.5,4.4c-0.5,1.3-1.7,4.7,0,6.7c0.8,1,2.1,1.3,2.6,1.5c0.6,0.2,1.9,0.5,3.2,0
c2.1-0.8,2.7-3,2.9-3.5c0.5-1.7,0.2-3.1,0-3.8c-0.4-1.6-1.2-2.6-1.5-2.9C146.9,53.4,145.4,51.5,143.7,51.7z"></path>
<path class="st0" d="M176.9,51.7c-1.9,0.2-2.9,2.9-3.5,4.4c-0.5,1.3-1.7,4.7,0,6.7c0.8,1,2.1,1.3,2.6,1.5c0.6,0.2,1.9,0.5,3.2,0
c2.1-0.8,2.7-3,2.9-3.5c0.5-1.7,0.2-3.1,0-3.8c-0.4-1.6-1.2-2.6-1.5-2.9C180.1,53.4,178.6,51.5,176.9,51.7z"></path>
<path class="st0" d="M160.5,73.3c0,1.7,0,3.5,0,5.2c0,1.2,0,2.9,0,2.9l0,0c-0.4,1.8-0.1,2.6,0.3,2.9c0,0,0.4,0.3,2.9,0.3l0,0
c0.3,0.2,2,1.3,2.3,3.5c0.1,0.4,0.2,1.7-0.6,2.9c-0.9,1.2-2.6,1.8-4.4,1.5"></path>
<path class="st0" d="M146,101.2c1.4,0.9,3.5,2,6.1,2.9c1.7,0.6,3.4,1.2,5.8,1.5c0.8,0.1,4.6,0.4,9-1.2c2.9-1,4.9-2.4,6.4-3.5
c1.8-1.3,3.1-2.5,4.1-3.5"></path>
</svg>
</div>
</div>
Файл JSFiddle:https://jsfiddle.net/RaKa7/0hLxarfs/8
Комментарии:
1. установите атрибут tabindex для каждого пути.
2. @RobertLongson спасибо, что сработал для фокуса, как я могу перемещаться без использования вкладки?
3. использовать мышь, чтобы щелкнуть по чему-либо?
4. @RobertLongson да, это было бы неплохо, но разрешено только взаимодействие с клавиатурой.
5. затем используйте клавишу tab.