We need to show an SVG map inside a react component and want to add dynamic layers(Shapes, texts, icons) on top of the SVG map, with zoom in zoom out and draggable features

Job Description:

We have a blocking point in our project and want you to solve this problem by creating a tiny brand new react app:

We need to show an SVG map inside a react component and want to add dynamic layers(Shapes, texts, icons) on top of the SVG map, with zoom in zoom out, and draggable features

Users want to zoom in and zoom out the SVG map.

Users can drag and drop layers(shape, text, icon) during zoom-in and zoom-out modes.

Users can show or hide specific layers from the top of svg.

We already implemented the solution but some of the above features have not worked smoothly. And these are the blocking point for our implementation:

Blocking points

The Draggable does not work smoothly while in zoom-in mode.

When we show and hide some of the icons or shapes from the top of SVG the other icons change their locations.

These are the solutions we used to solve these blocking points but have not worked yet:

[login to view URL]

[login to view URL]@d3/drag-zoom

[login to view URL]

[login to view URL]

[login to view URL]

Skills: CSS, HTML5, JavaScript, React.js, SVG

About the Client:
( 0 reviews ) Kabul, Afghanistan

Project ID: #35865009

13 freelancers are bidding on average $143 for this job


Hello! We can discuss in details? Do you have any timeframe? We welcome you to join hands with us as we think we are capable enough to start this project and we give you surety of answering all of your queries .We are More

$140 USD in 7 days
(51 Reviews)

⭐⭐⭐It's me you're looking for.⭐⭐⭐ Hi, there. I am a specialist with 6 years proven experience in Full Stack development using Node.js,React.js. I have checked your project description thoroughly and I think that I can More

$200 USD in 3 days
(18 Reviews)

Hello, Thank you for your project. I've just checked your job description carefully. As a solo senior full stack developer, I have strong experience of creating 500+ professional clean projects for the past 7 years. More

$100 USD in 2 days
(9 Reviews)

Hello, there! I CAN START YOUR PROJECT RIGHT NOW. I have just read your requirement and I understood what you would like to do. I have the experience and skills to create results that fully satisfy your requirements. P More

$140 USD in 7 days
(1 Review)

HELLO DEAR CLIENT! I have gone through your project details, having all the required skills (PHP, Laravel and MySQL)and VAST EXPERIENCE.I confirm to you that the project is doable since its within my area of EXPERTISE. More

$100 USD in 7 days
(4 Reviews)

Hi, We have 4+ years of experience in Full-stack Development using React.js, JavaScript, SVG and can help you with smooth functioning of the feature as we have done this before for our various projects. Please connect More

$200 USD in 7 days
(5 Reviews)

Dear Client, I am writing to express my interest in working on a project with your esteemed organization. My name is Deependra Singh and I am a web developer with 2 years of experience in web development, JavaScript, More

$140 USD in 7 days
(0 Reviews)

Hi Greetings! I am available right now for the project discussion and can start the project on an immediate basis. I have understood your project requirement I have7++ experience in design and development. I can ha More

$250 USD in 7 days
(0 Reviews)