React Front-End Component for Analyzing Image
Budget: $15 – $25 USD
Task 1: Spot Temperature
Create a React component that has an image frame that you can hover over with a crosshair mouse icon. When you click on any part of the image, it sends out the X, Y axis coordinates plus the value in the Emissivity Number Input as a request and retrieves a temperature value (can use mock data/server request for temperature response). The crosshair would freeze on the image until a new position is clicked.
Task 2: Temperature Range
Below the image is a range slider with values from 0 to 100. When you slide the range slider, it sends the min value and max value as a request and retrieves a new image (can use mock data/server request for new image response)
Tech Stack
Typescript
React
ChakraUI Components
Create a React component that has an image frame that you can hover over with a crosshair mouse icon. When you click on any part of the image, it sends out the X, Y axis coordinates plus the value in the Emissivity Number Input as a request and retrieves a temperature value (can use mock data/server request for temperature response). The crosshair would freeze on the image until a new position is clicked.
Task 2: Temperature Range
Below the image is a range slider with values from 0 to 100. When you slide the range slider, it sends the min value and max value as a request and retrieves a new image (can use mock data/server request for new image response)
Tech Stack
Typescript
React
ChakraUI Components