B. Using either the GeoNames or Worldbank API from the Web Links section, identify each of the following sixproperties for each country:
●
country name (e.g., Chad)
●
country capital (e.g., N’Djamena)
●
country region (e.g., Sub-Saharan Africa)
●
income level (e.g., low income)
●
two additional country properties of your choice
C.
Assign the map component to the default URL using an Angular routing module.
D. Create an HTML layout with two columns: one column for the map itself and one column to show the required
country information from the API in part B.
E. Convert the SVG map into an interactive Angular component by connecting all the “path” tags inside the SVG
file to mouse event handlers so each path is recognized and transmitted to the parent component hosting the map
if a mouse event occurs.
F. Generate an API service that uses the built-in Angular module HTTP client to make HTTP calls and include the
following:
●
one method that accepts a country name or id as an input parameter that returns additional information
gathered from the API for the selected country
●
one method that will trigger the API call when a country is selected and set a local variable that will receive
the information about the country for display in the right column of the HTML page
G.
Provide a compressed file of your website, including each of the following files:
●
HTML
●
TS
●
SVG
●
JSON configuration files
H. Acknowledge sources, using in-text citations and references, for content that is quoted, paraphrased, or
summarized.
I.
Demonstrate professional communication in the content and presentation of your submission.
Links:
SVG file: https://innovsandbox.space/map.html
Required API:
https://www.geonames.org/export/web-services.html
https://datahelpdesk.worldbank.org/knowledgebase/articles/898581-api-basic-call-structures