D3.js and React: Interactive visualisation

I a map in d3.js (GeoJson file is attached) and inside that map circles in specific longitude and latitude for districts (csv file with district name, long, latit is attached), these circles should differ in size OR color "depend on price range" (csv file with average property prices per year for each district is attached). And I want line chart to show all districts prices change in time, "years". finally, a bar chart to show total offers per district ([login to view URL] attached). using brush tack alook: [login to view URL] At the end, I want that to be on the same dashboard and have some interactivity like when I hover on one district circle it shows the name of district in both Arabic and English and the average price of villas for sales in that district in tooltip, and at the same time the line that belongs to this district in the line chart should be highlighted or having another color. also, that selected district should be highlighted in the bar chart. And also it should give me choice to select the year like when I select 2016 in the x-axis of line chart it shows the circles in the map that belong to 2016 and so on. link to give you a similar idea: [login to view URL] This for the property for sale (Villas). the same thing exactly I want it for property for rent (Appartments) . but I Will provide that csv later. In summary, two dashboards linked through button each has an interactive map, line chart, and bar chart. Note: you need to give me feedback periodically on your progress. if you want any further details do not hesitate to ask me.