Jkwang/d3 scatter color size

Description

Added code changes to allow for color and size differences for points in the scatter plot.

Changes Made

• Changed a forgotten "rect" to "circle" to clean up the class names.
• Changed the y-axis to log-scale and changed the tick labels from two decimals to no decimals with scientific notation.
• Added color scale to the points based on economic group.
• Changed the size of the circles (radius) to scale with the square root of population.

How to Test

Please check if the chart renders correctly with different colors and sizes of the points. Please review the way rScale is setup, and check to see if the range of circle radii is defined well. I defined the range of radii in the rScale function to be 0.5% to 5% of the chart width, is this the best way?

Review Needs

Does this MR include data processing, modeling, or visualization code that will require domain review prior to release?

• Yes, and I have opened an issue to document the need for review, using the DomainReview issue template
• Yes, and a domain review issue already exists
• No

Related Issues

Provide links to any related issues, including open draft domain review issues.

Additional Notes

Include any extra information or considerations for reviewers.

Merge Request Checklists

• Code changes adhere to best practices documented in README.md
• Code has been cleaned the way Vue likes it - run npm run lint --fix
• If applicable, the need for future domain review has been documented in an issue
• Below section documents which browsers the site has been tested on:
  • Desktop/laptop
    • Chrome
    • Safari
    • Edge
    • Firefox
  • Mobile device
    • Chrome
    • Safari
    • Edge
    • Firefox