'How to console property of svg on onPress in React Native?

<Svg xmlns="http://www.w3.org/2000/svg" width="700" height="1000" fill="none">
    <G id="pointer"   onPress={clicked}>
     
              <Path fill="#721111" id='satdobato'  d="M556.412 182.496C549.317 172.21 548 171.155 548 167.375C548 162.197 552.197 158 557.375 158C562.553 158 566.75 162.197 566.75 167.375C566.75 171.155 565.433 172.21 558.338 182.496C557.873 183.168 556.877 183.168 556.412 182.496ZM557.375 171.281C559.532 171.281 561.281 169.532 561.281 167.375C561.281 165.218 559.532 163.469 557.375 163.469C555.218 163.469 553.469 165.218 553.469 167.375C553.469 169.532 555.218 171.281 557.375 171.281Z"   />
              <Path fill="#721111" id='balkhu'  d="M610.412 337.496C603.317 327.21 602 326.155 602 322.375C602 317.197 606.197 313 611.375 313C616.553 313 620.75 317.197 620.75 322.375C620.75 326.155 619.433 327.21 612.338 337.496C611.873 338.168 610.877 338.168 610.412 337.496ZM611.375 326.281C613.532 326.281 615.281 324.532 615.281 322.375C615.281 320.218 613.532 318.469 611.375 318.469C609.218 318.469 607.469 320.218 607.469 322.375C607.469 324.532 609.218 326.281 611.375 326.281Z"   />
              <Path fill="#721111" id='kalanki'  d="M566.412 518.496C559.317 508.21 558 507.155 558 503.375C558 498.197 562.197 494 567.375 494C572.553 494 576.75 498.197 576.75 503.375C576.75 507.155 575.433 508.21 568.338 518.496C567.873 519.168 566.877 519.168 566.412 518.496ZM567.375 507.281C569.532 507.281 571.281 505.532 571.281 503.375C571.281 501.218 569.532 499.469 567.375 499.469C565.218 499.469 563.469 501.218 563.469 503.375C563.469 505.532 565.218 507.281 567.375 507.281Z"   />
              <Path fill="#721111" id='newbuspark' d="M407.412 628.496C400.317 618.21 399 617.155 399 613.375C399 608.197 403.197 604 408.375 604C413.553 604 417.75 608.197 417.75 613.375C417.75 617.155 416.433 618.21 409.338 628.496C408.873 629.168 407.877 629.168 407.412 628.496ZM408.375 617.281C410.532 617.281 412.281 615.532 412.281 613.375C412.281 611.218 410.532 609.469 408.375 609.469C406.218 609.469 404.469 611.218 404.469 613.375C404.469 615.532 406.218 617.281 408.375 617.281Z"   />
              <Path fill="#721111" id='baneshowr'  d="M409.682 336.731C409.497 338.449 407.954 339.69 406.235 339.504C404.516 339.318 403.276 337.775 403.462 336.057C403.647 334.338 405.19 333.098 406.909 333.283C408.623 333.469 409.868 335.012 409.682 336.731ZM405.493 348.21C398.33 347.834 393.208 341.462 394.101 334.567C394.648 330.339 397.314 326.906 400.893 325.192C408.755 321.428 417.968 327.019 418.213 335.769C418.413 342.946 412.431 348.571 405.493 348.21ZM414.277 339.421C415.639 333.659 406.44 329.367 402.695 327.985C399.887 330.734 399.321 337.194 401.045 344.802C404.404 345.573 409.301 343.513 414.277 339.421Z"   />
    </G>
  </Svg>

so this is my code and i want to trigger actions based on the ids of path given how to console the id and other properties of svg

  const clicked=(e)=>{
  console.log("e dasdasdis",e.target)

} enter code here



Solution 1:[1]

You can try to send items to onClick event directly from SVG. onPress = {()=> onClicked(id, height, width)}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 nv08