Example Visualizations using CyberGIS-Vis¶

Documentations and Demos about CyberGIS-Vis are available at: https://github.com/su-gis/CyberGIS-Vis ¶

Adaptive Choropleth Mapper with Multiple Line Chart (MLC): Temporal Patterns of Covid-19 Crude Rate and Death Rate in US Counties¶

Setup environment¶

import pandas as pd
import geopandas as gpd
from Adaptive_Choropleth_Mapper import Adaptive_Choropleth_Mapper_viz, Adaptive_Choropleth_Mapper_log

Set input Data¶

Load U.S. counties from the Shapefile. Note: New York is an exception, represented by New York City with the city ID 777777, instead of county names and IDs.

Read the Shapefile "County_NY_TIMES.shp" into a GeoDataFrame
The Shapefile is located in the "shp/US/" directory
The 'geoid' column is explicitly set to be read as a string (str)

shapefile_US = gpd.read_file("shp/US/County_NY_TIMES.shp", dtype={'geoid': str})
shapefile_US

Load the attribute data that will be used for visualization. Data Source: "The New York Times. (2021). Coronavirus (Covid-19) Data in the United States. Retrieved [08/01/2024], from https://github.com/nytimes/covid-19-data."

Read the CSV file "Covid_Rate_US_2020_2021_weekly.csv" into a DataFrame
The CSV file is located in the "attributes/" directory
The 'geoid' column is explicitly set to be read as a string (str)

Covid_Rate_US_2020_2021_weekly = pd.read_csv("attributes/Covid_Rate_US_2020_2021_weekly.csv", dtype={'geoid': str} )
Covid_Rate_US_2020_2021_weekly

Configure the parameters to visualize your COVID-19 datasets.¶

Input Parameters for Visualizing Adaptive Choropleth Maps.¶

Parameter	Required	Description
title	✓	Enter the title to display at the top of your result visualization.
Subject		Enter the text to display at the top of your chart.
filename_suffix	✓	Specify the name of the folder where your result files will be saved.
inputCSV	✓	Specify the attributes from your input data.
shapefile	✓	Provide the shapefile that includes the geometry of your study area.
periods	✓	Enter "All" to visualize all dates from the 'period' column of your input data. To visualize specific periods, provide the desired values from the 'period' column as an array (e.g., `[2020, 2021, 2023]`). Ensure these values match the entries in your data.
variables	✓	Enter the names of the columns in your input data to include in the visualization.
NumOfMaps	✓	Specify the number of maps to display in your result visualization.
SortLayers		Choose between `'compare'` or `'temporal'` mode:
		- Compare Mode: Compare variables at a specific point in time.
		- Temporal Mode: Display spatiotemporal patterns of the same variable across multiple maps.
InitialLayers		Enter the variables to display by default on your maps.
Initial_map_center		Enter the longitude and latitude of the center of your study area in decimal degrees. If left blank, the map will automatically center based on your data.
Initial_map_zoom_level		Enter a number between 2 and 15 for the zoom level. If left blank, the maps will automatically adjust the zoom level.
Map_width		Specify the width of the maps. If left blank, the default is 500px.
Map_height		Specify the height of the maps. If left blank, the default is 500px.

Input parameters for visualizing charts.¶

Parameter	Required	Description
Top10_Chart		Enter `True` or `False`. Set to `True` to display a bar chart representing the top and bottom values within the right map. If `False`, the chart will not be displayed. If left blank, `False` is the default.
Multiple_Line_Chart		Enter `True` or `False`. Set to `True` to display a Multiple Line Chart. If `False`, it will not be displayed. If left blank, `False` is the default.
Comparision_Chart		Enter `True` or `False`. Set to `True` to display a Comparision Line Chart. If `False`, it will not be displayed. If left blank, `False` is the default.
Stacked_Chart		Enter `True` or `False`. Set to `True` to display a Stacked Chart. If `False`, it will not be displayed. If left blank, `False` is the default.
Correlogram		Enter `True` or `False`. Set to `True` to display a Correlogram. If `False`, it will not be displayed. If left blank, `False` is the default.
Scatter_Plot		Enter `True` or `False`. Set to `True` to display a Scatter Chart. If `False`, it will not be displayed. If left blank, `False` is the default.
Parallel_Coordinates_Plot		Enter `True` or `False`. Set to `True` to display a Parallel Coordinates Plot. If `False`, it will not be displayed. If left blank, `False` is the default.

Input parameters for visualizing 'Multiple Line Chart'.¶

Parameter	Required	Description
titlesOfMLC		Enter a title for each line chart to be displayed at the top of the chart in the Multiple Line Chart. If left blank, a line chart will be created for each variable in your input attribute file.
NumOfMLC		Specify the number of line charts to include in the Multiple Line Chart. If left blank, the number of charts will default to the number of variables entered in the 'Variables' parameter above.
InitialVariableMLC		Select the variables to be displayed on the line chart. If left blank, the variables in your input attribute file will be visualized in order.
DefaultRegion_MLC		Enter the 'id' from your attribute table to specify the default region displayed in the Multiple Line Chart. If left blank, the first region listed in your attribute table will be used.
HighlightMLC		Define the highlighted ranges for the x-axis values (periods) by specifying the start and end periods for the range you emphasize.

Input parameters for visualizing 'Comparison Line Chart'.¶

Parameter	Required	Description
NumOfCLC		Specify the number of line charts to include in the Comparision Line Chart. If left blank, the number of charts will default to the number of variables entered in the 'Variables' parameter above.
InitialVariableCLC		Select the variables to be displayed on the line chart. If left blank, the variables in your input attribute file will be visualized in order.
DefaultRegion_CLC		Enter the 'id' of two regions to display the temporal patterns of the selected variable in the Comparison Line Chart. If left blank, the first two regions in your attribute table will be used.
HighlightCLC		Define the highlighted ranges for the x-axis values (periods) by specifying the start and end periods for the range you emphasize.

Set the parameters to create visualizations using Multiple Linked Charts (MLC).¶

The interface will include two choropleth maps, a chart displaying the top or bottom values of your selected variable, such as COVID-19 confirmed rates, within the geographic regions of your map, and multiple linked charts (MLC). The MLC feature allows users to click on any county to explore spatiotemporal patterns of selected variables, such as COVID-19 confirmed or death rates, across multiple time series charts.

Your result visualization would be similar to the image below.

param_MLC_COVID_US_2020_2021 = {
    'title': "Spatiotemporal Dynamics of COVID-19 Cases and Deaths in U.S. Counties",
    'Subject': "Temporal Patterns of COVID-19 Risk Factors",
    'filename_suffix': "COVID_MLC",  # max 30 character      
    'inputCSV': Covid_Rate_US_2020_2021_weekly,   
    'shapefile': shapefile_US, 
    'periods': "All",
    'variables': [         
            "confirmed_rate", 
            "death_rate",
            "confirmed_rate_total",
            "death_rate_tatal"
        ],
    'NumOfMaps':2,
    'SortLayers': "temporal",    
    'InitialLayers':["2020-04-06_confirmed_rate" , "2020-07-20_confirmed_rate"],
    'Initial_map_center':[38, -97],
    'Initial_map_zoom_level':4,    
    'Map_width':"650px",
    'Map_height':"450px", 
    'Top10_Chart': True,     
    'Multiple_Line_Chart': True,
    'NumOfMLC':4,
    'titlesOfMLC':["1. Confirmed Rate (Confirmed Cases per 10k population)", "2. Death Rate (Deaths per 10k population)", "3. Cumulative Confirmed Rate", "4. Cumulative Death Rate"],
    'DefaultRegion_MLC':"12086" 
}
Adaptive_Choropleth_Mapper_viz(param_MLC_COVID_US_2020_2021)
Adaptive_Choropleth_Mapper_log(param_MLC_COVID_US_2020_2021)

/cvmfs/cybergis.illinois.edu/software/conda/cybergisx/python3-0.9.0/lib/python3.8/site-packages/pandas/core/dtypes/cast.py:1990: ShapelyDeprecationWarning: __len__ for multi-part geometries is deprecated and will be removed in Shapely 2.0. Check the length of the `geoms` property instead to get the  number of parts of a multi-part geometry.
  result[:] = values

output directory :  ACM_COVID_MLC_US_2020_2021
To see your visualization, click the URL below (or locate the files):
https://cybergisx.cigi.illinois.edu/user/suhan2/view/CyberGIS-Vis_SIGSPATIAL2024_20240828/Quantitative_Data_Vis/ACM_COVID_MLC_US_2020_2021/index.html
To access all visualizations that you have created, click the URL below (or locate the files):
https://cybergisx.cigi.illinois.edu/user/suhan2/view/CyberGIS-Vis_SIGSPATIAL2024_20240828/Quantitative_Data_Vis//ACM_log.html
Advanced options are available in 
https://cybergisx.cigi.illinois.edu/user/suhan2/edit/CyberGIS-Vis_SIGSPATIAL2024_20240828/Quantitative_Data_Vis/ACM_COVID_MLC_US_2020_2021/data/CONFIG_COVID_MLC_US_2020_2021.js

Set the parameters to create visualizations using Comparison Line Chart (CLC).¶

Configure the parameters to visualize your COVID-19 datasets using the Comparison Line Chart (CLC). The interface will include two choropleth maps, a chart displaying the top or bottom values of your selected variable, such as COVID-19 confirmed rates, within the geographic regions of your map, and the Comparison Line Chart (CLC). The CLC feature allows users to click on any county on the two choropleth maps to compare spatiotemporal patterns of selected variables, such as COVID-19 confirmed or death rates, in a single interactive line chart.