3c:null 3d:["$","title",null,{"children":"CS725 - Information Visualization | maazhasnainkhan's Workspace | Observable"}] 43:T808,As the world emerged from the socio-economic devastation wrought by the COVID-19 pandemic, it was unprepared for another surge in viral infections. Shortly after COVID-19 restrictions were lifted, hospitals around the globe experienced a sharp increase in influenza cases, the worst this world had seen in the last three decades. This rise in influenza post COVID-19 pandemic led to the creation of this project. During the COVID-19 pandemic, people sought to understand the numbers, figures, and trends, as well as the havoc wreaked by COVID on our planet. This led to the emergence of interactive visualization dashboards, with every governmental body, international organization, and NGO in the public health sector posting these dashboards on their websites for public viewing. This facilitated a better understanding of pandemic trends globally among the general public. After the COVID-19 pandemic, when influenza cases began to rise, I noticed an abundance of interactive visualization dashboards for COVID-19, but very few, if any, for influenza. Therefore, I decided to create one for this project. The dashboard aims to help the general public understand global influenza trends. Additionally, researchers may find it beneficial for examining recent influenza trends and epidemiological dynamics of the virus. The main question driving this project is: Can the global influenza trends, as depicted through comprehensive visualizations of seasonal variations, testing volumes, and positivity rates, offer valuable insights into the epidemiological dynamics of the virus? In summary, this project aims to fill the gap in available resources by offering an interactive dashboard that helps the public and researchers understand global influenza trends. By providing insights into seasonal variations, testing volumes, and positivity rates, this tool contributes to global public health efforts. With a focus on transparency and data-driven insights, we aim to empower individuals and organizations worldwide in their efforts to combat influenza.44:T72b,The data used for this project was acquired from ***WHO's*** website. The data was collected through a web based tool ***FluNet***, an online platform initiated in 1997 by WHO, serves as a vital tool for worldwide surveillance of influenza viruses. It plays a crucial role in monitoring and understanding the global spread of these viruses by collecting and providing virological data, such as the count of influenza viruses categorized by subtype. This information is instrumental in interpreting epidemiological data. Using data acquired through FluNet, we applied different data science techniques to clean and filter the data so it could fit our requirements and then use ***Vega-Lite*** to create the visualizations. In creating the visualizations, the primary aim was to distill complex influenza data into easily understandable insights that shed light on global trends and dynamics. Through the charts, I sought to highlight several key aspects of influenza epidemiology. Firstly, the visualizations aimed to showcase the seasonal variations in positive influenza cases across different years, providing insights into the cyclical nature of influenza activity. Additionally, they also focused on elucidating the long-term trends in positive cases over time, aiming to identify any significant shifts or patterns. Furthermore, they endeavored to explore the relationship between testing volume and influenza cases, investigating how testing dynamics contribute to our understanding of disease prevalence. By emphasizing these aspects of the data, the visualizations aim to empower both the general public and researchers with actionable insights into global influenza trends. The raw dataset can be accessed through the link below: Raw Dataset Link: **[Global Influenza Programme - FluNet](https://www.who.int/tools/flunet)**45:Tac9,The dashboard created presents a comprehensive view of global influenza trends through a series of visually intuitive charts. The grouped bar chart and the line chart illustrates seasonal variations and long-term trends in positive cases over time, identifying any notable increases or decreases. The scatterplots provide insights into testing dynamics: The first scatterplot reveals the relationship between testing volume and positive cases, the second scatterplot examines testing volume against negative cases, and the third scatterplot explores the interplay between negative and positive cases. At the top of the dashboard, a selector drop-down menu has been added, allowing users to toggle between the Northern and Southern Hemispheres. This feature enables users to focus on a specific hemisphere of interest and tailor their analysis accordingly. The dashboard created is interactive. The key interactive elements include a shared brush selection tool, allowing users to make selections across multiple charts simultaneously. When data points on the scatterplot are selected using the brush, several transformations occur to provide a focused view of the selected data. Firstly, the selected points on the scatterplot remain colored, while the rest are greyed out, enabling users to easily identify the selected data. Secondly, the corresponding bars on the grouped bar chart remain colored, providing visual reinforcement of the selected data points. Finally, the lines on the line chart are transformed based on the selected data points, displaying only the data within the selection area of the brush. Similarly, when a selection is made on the line chart using the brush, the visualization responds dynamically to provide relevant insights. The selection causes the line chart to transform, displaying only the lines within the selection area. Additionally, the scatterplot adjusts to show only the data points corresponding to the highlighted lines, maintaining color for selected points and greying out the rest. Similarly, the corresponding bars on the grouped bar chart reflect the transformed data, remaining colored for selected data points and greyed out for others. The interactive features embedded within the visualization directly address the main question raised in the introduction by providing users with a comprehensive tool for exploring global influenza trends. By allowing selections to be made across multiple charts simultaneously, the visualization facilitates a deeper understanding of seasonal variations, testing volumes, and positivity rates. Users can dynamically filter and explore the data, gaining valuable insights into the epidemiological dynamics of the virus and informing decision-making processes effectively.46:T2a9d,The influenza dashboard is designed to maximize clarity and insight, adhering to principles such as simplicity, consistency, and meaningful interactivity. This approach ensures that data is not only displayed efficiently but also allows users to engage and extract detailed insights effectively. The design decisions discussed below apply to both Northern and Southern Hemisphere charts; the distinction lies solely in the dataset used, not in the visual representation methods. ### Multiple Line Chart **Idiom:** Multiple Line Chart / **Mark:** Dots | Data: Attribute | Data: Attribute Type | Encode: Channel | | ---------------------------- | -------------------- | ----------------------- | | Months | Key, Temporal | Horizontal Position (X-axis) | | Total Number of Influenza Cases | Value, Quantitative | Vertical Position (Y-axis) | | Year | Key, Temporal | Color Hue (Third Channel) | A combination of line and circle marks is used to depict the temporal progression and magnitude of influenza cases, both pre and post-COVID. The line chart shows trends over time, helpful for identifying patterns or anomalies in the data. Circle marks highlight individual data points, providing exact values at specific times, which enhances the granularity of the observed trends. For this chart I used line and circle marks both because I did not liked the traditional ruler type tooltip used mostly in line charts conventionally. I wanted my tooltip to appear as the user hovered his pointer over the line. However, the pointer had to be exactly placed on the data point on the line for it to show the tooltip, which was not user-friendly. Therefore, I added points to increase the area where the mouse could be hovered on to show the tooltip. I layered both line and circle on top of each other to merge them both together. Another, decision I made was to show the pre-COVID line as a dashed line to differ it from the rest of the post-COVID lines. To implement this I created the the charts with pre-COVID lines separately and layered them onto the chart with post-COVID lines. ### Grouped Bar Chart **Idiom:** Bar Chart / **Mark:** Line | Data: Attribute | Data: Attribute Type | Encode: Channel | | -------------------------------- | -------------------- | ------------------------ | | Months | Key, Temporal | Horizontal Grouping (Columns) | | Total Number of Influenza Cases | Value, Quantitative | Vertical Position (Y-axis) | | Year | Key, Temporal | Horizontal Position (X-axis) / Color Hue (Third Channel) | Bar charts are used to show the distribution of total influenza cases across months, segmented by year. This visualization makes it straightforward to compare the frequency of cases across different times of the year and observe any seasonal trends or deviations year by year. This visualization facilitates a straightforward comparison of monthly case loads over different years, making it easy to observe seasonal trends or significant deviations from the norm. Each year's data is represented in different colors to provide clear differentiation. This chart is particularly useful for spotting outbreaks or evaluating the effectiveness of public health interventions over time. It allows users to quickly assess which months have historically seen higher influenza activity, aiding in future preparedness and response planning. ### Scatterplots Scatterplots are used to examine the relationship between the number of tests conducted and positive or negative influenza cases. This choice helps in identifying correlations or distribution patterns between two quantitative variables. ##### Test Counts vs. Positive Cases **Idiom:** Scatterplot / **Mark:** Dots | Data: Attribute | Data: Attribute Type | Encode: Channel | | ---------------------------- | -------------------- | ----------------------- | | Specimen Processed Number | Value, Quantitative | Horizontal Position (X-axis) | | Positive Cases | Value, Quantitative | Vertical Position (Y-axis) | | Year | Key, Temporal | Color Hue (Third Channel) | This scatterplot explores the relationship between the number of influenza tests conducted and the number of positive results. By displaying each data point, users can identify trends in testing efficacy or changes in infection rates over time. ##### Test Counts vs. Negative Cases **Idiom:** Scatterplot / **Mark:** Dots | Data: Attribute | Data: Attribute Type | Encode: Channel | | ---------------------------- | -------------------- | ----------------------- | | Specimen Processed Number | Value, Quantitative | Horizontal Position (X-axis) | | Negative Cases | Value, Quantitative | Vertical Position (Y-axis) | | Year | Key, Temporal | Color Hue (Third Channel) | Similar in design to the first scatterplot but focuses on the number of negative results. It helps in understanding the proportion of negative results in relation to increased testing, which can indicate periods of low transmission or effective containment. ##### Positive vs. Negative Cases **Idiom:** Scatterplot / **Mark:** Dots | Data: Attribute | Data: Attribute Type | Encode: Channel | | ---------------------------- | -------------------- | ----------------------- | | Positive Cases | Value, Quantitative | Horizontal Position (X-axis) | | Negative Cases | Value, Quantitative | Vertical Position (Y-axis) | | Year | Key, Temporal | Color Hue (Third Channel) | This plot compares the numbers of positive and negative test results directly. It is useful for assessing the test positivity rate and overall test performance over different periods. ### Interactive Features The interactive features in the influenza dashboard are designed to enhance user engagement and provide a powerful analytical tool by enabling dynamic exploration of data. The use of shared brushing and filtering mechanisms across various visualizations offers a cohesive and integrated user experience. When users select specific data points on a scatterplot, these points remain colored while the rest are greyed out, emphasizing the selected data. This selection simultaneously affects the bar chart, where bars corresponding to the selected data points in the scatterplot also remain colored, and the line chart, which transforms to reflect only the data corresponding to the selected points. This interactivity allows users to isolate specific segments of data across multiple chart types, making complex datasets more manageable and revealing hidden patterns or correlations. Similarly, when a selection is made on the line chart using the brush tool, the visualization focuses solely on the data within that selected range. This causes the scatterplots to adjust and display only data points corresponding to the time frame selected on the line chart, with non-relevant data greyed out. The bar chart mirrors this effect, highlighting only the bars for the selected period. This selective focus provides a detailed examination of the interactions between different variables during specific times, helping users analyze specific periods such as a particular flu season or the effectiveness of interventions in specific months. Additionally, the dashboard includes a selector or drop-down menu that allows users to switch between visualizations for the Northern and Southern Hemispheres. This feature enhances the dashboard's usability by providing a simple method for comparing influenza trends across different hemispheres. Users can easily toggle between the two datasets, enabling quick comparisons and deeper insights into how influenza behaves in different hemispheres. This selector not only increases the dashboard’s flexibility but also its educational value, as it facilitates a global perspective on influenza patterns, useful for both public interest and research contexts. Overall, the dashboard's interactive elements not only display data but also transform it into a dynamic exploration tool, enabling users to generate actionable insights through active participation and customized analysis. These features reduce cognitive overload, minimize potential errors in data interpretation, and make the analytical process more engaging and insightful. ### Layout In the design of the influenza dashboard, careful consideration was given to the layout and positioning of visual elements to ensure information is presented clearly and effectively, fitting within a single screen without the need for scrolling. This approach was adopted to respect the user's cognitive load and facilitate immediate access to all levels of data analysis, from high-level overviews to detailed correlations. The dashboard leads with a hemisphere selector prominently positioned at the top. This placement emphasizes its role as a critical control element, allowing users to switch between datasets for the Northern and Southern Hemispheres. By situating this control at the apex of the visual field, it naturally becomes the starting point for the data exploration, setting the hemispheric context for the insights. To the left, the bar chart presents a comparative analysis of influenza cases by month and year. This visualization effectively utilizes vertical space, with the height of the bars enabling a quick visual assessment of cases. The color coding facilitates differentiation between years, and the horizontal alignment of the months allows for an intuitive seasonal trend analysis. Positioning this chart on the left side aligns with the natural progression of visual exploration from left to right, ensuring that viewers first encounter a summarization of the data in an aggregated form. Below the bar chart, spanning the full horizontal extent of both the bar and scatterplots, the line and circle chart acts as an integrative element, combining temporal trends with point-specific data. The deliberate use of dashed and solid lines distinguishes between pre- and post-COVID data, allowing for a detailed perspective on the pandemic's impact. Overlaying circles on the lines not only augments the visual appeal but also increases the interaction surface, enabling a more user-friendly experience when seeking specific data through tooltips. On the right side, three scatterplots provides a matrix layout that invites comparison across different variables. This side-by-side arrangement promotes efficient cross-variable analysis without the need for additional navigation, enhancing the interactivity and depth of exploration possible within the dashboard.47:Taf9,The development of the influenza dashboard was an extensive process, reflecting a significant investment in both time and effort. In total, approximately 20-25 hours were dedicated to bringing this visualization to life. The endeavor was multifaceted, involving individual chart creation, integration into separate hemispheric dashboards, and ultimately the modifying it into a unified dashboard with dynamic filtering capabilities. One of the most time-consuming aspects of this project was the implementation in both Vega-Lite and ***D3.js***. Initially, D3.js offered the flexibility desired for such a complex visualization; however, challenges arose with the update functions for interactive charts. This led to a strategic retreat to Vega-Lite, which, while presenting its own set of constraints, ultimately proved to be more suitable for this application. Crafting each chart with precision and then integrating them into a cohesive dashboard required meticulous attention to detail. Particularly proud achievements include the innovative layering of lines and circles to create a custom tooltip experience—a creative solution that not only provided a visually engaging element but also enhanced user interaction by making data points more accessible. Furthermore, the layering of dashed and solid lines to differentiate the data from the pre- and post-COVID eras added a narrative quality to the dashboard, allowing users to trace the pandemic's impact through the visual language of the charts. However, the development process was not without its challenges. A notable issue encountered was a bug in Vega-Lite that affected the plotting of data, resulting in missing points on scatterplots. This obstacle was surmounted by employing ***vl.stroke*** instead of ***vl.color*** for encoding, showcasing problem-solving in action to maintain the integrity of the data representation. Despite these successes, there were ambitions that could not be realized within the constraints of Vega-Lite. The platform's limitations in handling multiple brushes did not allowed the addition of an 'onClick' interactive brush for the grouped bar chart, a feature that would have further enhanced the dashboard's interactivity. Moreover, while the line chart could be transformed through selection, replicating this behavior with the accompanying circles led to erratic brush behavior, underscoring another limitation of the Vega-Lite. Reflecting on the development journey, it becomes evident that the creation of this dashboard was as much an exercise in innovation and problem-solving as it was in data visualization. The experience underscores the balance between leveraging available tools with their inherent limitations and the creative aspiration to deliver an engaging and informative user experience.48:T41c,- HW1 - Vega-Lite, - HW3 - D3 Intro, - HW4 - Dashboards and Interaction (Vega-Lite Interactions), - Interaction UW Interactive Data Lab, - Intro to Interaction in Vega-Lite, - Vega-Lite Dashboard with Brushing and Linking, - Multi Series Line Chart with Tooltip, - Vega-Lite Chart Types, - Layers and Facets and Concat, Oh My!, - Vega-Lite API Selection Methods - v5, 49:T12b0,function renderNorthernHemisphere() { const sharedBrush = vl.selectInterval().encodings(['x', 'y']).name('sharedBrush').mark({ type: 'interval' }).resolve('intersect'); const circle = vl.markCircle() .data(influenza_nh_pre_covid) .encode( vl.x().fieldO('Month').sort(['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']), vl.y().fieldQ('INF_ALL'), vl.stroke().fieldN('Year').legend(false), vl.fill().fieldN('Year').legend(false), vl.size().value(50), vl.tooltip([vl.fieldN('Month'), vl.fieldQ('INF_ALL'), vl.fieldN('Year')]) ); const circle1 = vl.markCircle() .data(influenza_nh_post_covid) .encode( vl.x().fieldO('Month').sort(['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']), vl.y().fieldQ('INF_ALL'), vl.stroke().fieldN('Year').legend(false), vl.fill().fieldN('Year').legend(false), vl.size().value(50), vl.tooltip([vl.fieldN('Month'), vl.fieldQ('INF_ALL'), vl.fieldN('Year')]) ); const line = vl.markLine() .data(influenza_nh_pre_covid) .transform(vl.filter(sharedBrush)) .encode( vl.x().fieldO('Month').sort(['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']), vl.y().fieldQ('INF_ALL').title("Total Influenza Cases In Northern Hemisphere"), vl.stroke().fieldN('Year').legend(false), vl.strokeDash().value([5, 2]), vl.tooltip([vl.fieldN('Month'), vl.fieldQ('INF_ALL'), vl.fieldN('Year')]) ); const line1 = vl.markLine() .data(influenza_nh_post_covid) .transform(vl.filter(sharedBrush)) .params(sharedBrush) .encode( vl.x().fieldO('Month').sort(['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']), vl.y().fieldQ('INF_ALL').title("Total Influenza Cases In Northern Hemisphere"), vl.stroke().fieldN('Year').legend(false), vl.tooltip([vl.fieldN('Month'), vl.fieldQ('INF_ALL'), vl.fieldN('Year')]) ); const clayer = vl.layer(line, circle); const llayer = vl.layer(line1, circle1); const a = vl.layer(clayer, llayer) .width(720) .height(300); const scatterplot = vl.markCircle() .data(influenza_nh) .params(sharedBrush) .encode( vl.x().fieldQ("SPEC_PROCESSED_NB").title("Influenza Test in Northern Hemisphere"), vl.y().fieldQ("INF_ALL").title("Positive Cases In Northern Hemisphere"), vl.color().fieldN('Year').legend(false), //vl.fill().value('white'), vl.size().value(50), vl.opacity().if(sharedBrush, vl.value(0.8)).value(0.1), vl.tooltip([vl.fieldN('Month'), vl.fieldQ('INF_ALL'), vl.fieldN('Year')]) ) .width(180).height(180); const scatterplot1 = vl.markCircle() .data(influenza_nh) .params(sharedBrush) .encode( vl.x().fieldQ("SPEC_PROCESSED_NB").title("Influenza Test In Northern Hemisphere"), vl.y().fieldQ("INF_NEGATIVE").title("Negative Cases In Northern Hemisphere"), vl.color().fieldN('Year').legend(false), // vl.fill().value('white'), vl.size().value(50), vl.opacity().if(sharedBrush, vl.value(0.8)).value(0.1), vl.tooltip([vl.fieldN('Month'), vl.fieldQ('INF_NEGATIVE'), vl.fieldN('Year')]) ) .width(180).height(180); const scatterplot2 = vl.markCircle() .data(influenza_nh) .params(sharedBrush) .encode( vl.x().fieldQ("INF_ALL").title("Positive Cases In Northern Hemisphere"), vl.y().fieldQ("INF_NEGATIVE").title("Negative Cases In Northern Hemisphere"), vl.color().fieldN('Year').legend(false), // vl.fill().value('white'), vl.size().value(50), vl.opacity().if(sharedBrush, vl.value(0.8)).value(0.1), vl.tooltip([vl.fieldN('Month'), vl.fieldQ('INF_NEGATIVE'), vl.fieldQ('INF_ALL'), vl.fieldN('Year')]) ) .width(180).height(180); const bar = vl.markBar() .data(influenza_nh) .encode( vl.column().fieldO('Month').sort(['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']), vl.x().fieldN("Year").axis({ title: null }), vl.y().fieldQ('INF_ALL').title("Total Influenza Cases In Northern Hemisphere"), vl.color().fieldN("Year").legend(false), vl.color().if(sharedBrush, vl.fieldN("Year")).value('lightgrey'), vl.tooltip([vl.fieldN('Month'), vl.fieldQ('INF_ALL'), vl.fieldN('Year')]) ) .width(40).height(300); const vconcatScatterplots = vl.vconcat(scatterplot, scatterplot1, scatterplot2); const vconcat = vl.vconcat(bar, a); const northern_hemisphere = vl.hconcat(vconcat, vconcatScatterplots).title({text: "Influenza Insights: Hemispheric Analysis", fontSize: 18, anchor: 'middle'}) return northern_hemisphere .render(); }4a:T12ae,function renderSouthernHemisphere() { const sharedBrush = vl.selectInterval().encodings(['x', 'y']).name('sharedBrush').mark({ type: 'interval' }).resolve('intersect'); const circle = vl.markCircle() .data(influenza_sh_pre_covid) .encode( vl.x().fieldO('Month').sort(['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']), vl.y().fieldQ('INF_ALL'), vl.stroke().fieldN('Year').legend(false), vl.fill().fieldN('Year').legend(false), vl.size().value(50), vl.tooltip([vl.fieldN('Month'), vl.fieldQ('INF_ALL'), vl.fieldN('Year')]) ); const circle1 = vl.markCircle() .data(influenza_sh_post_covid) .encode( vl.x().fieldO('Month').sort(['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']), vl.y().fieldQ('INF_ALL'), vl.stroke().fieldN('Year').legend(false), vl.fill().fieldN('Year').legend(false), vl.size().value(50), vl.tooltip([vl.fieldN('Month'), vl.fieldQ('INF_ALL'), vl.fieldN('Year')]) ); const line = vl.markLine() .data(influenza_sh_pre_covid) .transform(vl.filter(sharedBrush)) .encode( vl.x().fieldO('Month').sort(['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']), vl.y().fieldQ('INF_ALL').title("Total Influenza Cases In Southern Hemisphere"), vl.stroke().fieldN('Year').legend(false), vl.strokeDash().value([5, 2]), vl.tooltip([vl.fieldN('Month'), vl.fieldQ('INF_ALL'), vl.fieldN('Year')]) ); const line1 = vl.markLine() .data(influenza_sh_post_covid) .transform(vl.filter(sharedBrush)) .params(sharedBrush) .encode( vl.x().fieldO('Month').sort(['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']), vl.y().fieldQ('INF_ALL').title("Total Influenza Cases In Southern Hemisphere"), vl.stroke().fieldN('Year').legend(false), vl.tooltip([vl.fieldN('Month'), vl.fieldQ('INF_ALL'), vl.fieldN('Year')]) ); const clayer = vl.layer(line, circle); const llayer = vl.layer(line1, circle1); const a = vl.layer(clayer, llayer) .width(720) .height(300); const scatterplot = vl.markCircle() .data(influenza_sh) .params(sharedBrush) .encode( vl.x().fieldQ("SPEC_PROCESSED_NB").title("Influenza Test in Southern Hemisphere"), vl.y().fieldQ("INF_ALL").title("Positive Cases In Southern Hemisphere"), vl.color().fieldN('Year').legend(false), //vl.fill().value('white'), vl.size().value(50), vl.opacity().if(sharedBrush, vl.value(0.8)).value(0.1), vl.tooltip([vl.fieldN('Month'), vl.fieldQ('INF_ALL'), vl.fieldN('Year')]) ) .width(180).height(180); const scatterplot1 = vl.markCircle() .data(influenza_sh) .params(sharedBrush) .encode( vl.x().fieldQ("SPEC_PROCESSED_NB").title("Influenza Test In Southern Hemisphere"), vl.y().fieldQ("INF_NEGATIVE").title("Negative Cases In Southern Hemisphere"), vl.color().fieldN('Year').legend(false), // vl.fill().value('white'), vl.size().value(50), vl.opacity().if(sharedBrush, vl.value(0.8)).value(0.1), vl.tooltip([vl.fieldN('Month'), vl.fieldQ('INF_NEGATIVE'), vl.fieldN('Year')]) ) .width(180).height(180); const scatterplot2 = vl.markCircle() .data(influenza_sh) .params(sharedBrush) .encode( vl.x().fieldQ("INF_ALL").title("Positive Cases In Southern Hemisphere"), vl.y().fieldQ("INF_NEGATIVE").title("Negative Cases In Southern Hemisphere"), vl.color().fieldN('Year').legend(false), // vl.fill().value('white'), vl.size().value(50), vl.opacity().if(sharedBrush, vl.value(0.8)).value(0.1), vl.tooltip([vl.fieldN('Month'), vl.fieldQ('INF_NEGATIVE'), vl.fieldQ('INF_ALL'), vl.fieldN('Year')]) ) .width(180).height(180); const bar = vl.markBar() .data(influenza_sh) .encode( vl.column().fieldO('Month').sort(['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']), vl.x().fieldN("Year").axis({ title: null }), vl.y().fieldQ('INF_ALL').title("Total Influenza Cases In Southern Hemisphere"), vl.color().fieldN("Year").legend(false), vl.color().if(sharedBrush, vl.fieldN("Year")).value('lightgrey'), vl.tooltip([vl.fieldN('Month'), vl.fieldQ('INF_ALL'), vl.fieldN('Year')]) ) .width(40).height(300); const vconcatScatterplots = vl.vconcat(scatterplot, scatterplot1, scatterplot2); const vconcat = vl.vconcat(bar, a); const southern_hemisphere = vl.hconcat(vconcat, vconcatScatterplots).title({text: "Influenza Insights: Hemispheric Analysis", fontSize: 18, anchor: 'middle'}) return southern_hemisphere .render(); }4b:[{"id":"efcf234c07ce04b14a0299b6be820dbffa3a570fff1d24eeb22835e30adf8574e93a4e39cb799b4a093dd084e49fc13b05f7bf61cef02e2edf9576b4d1d4af0e","href":"https://static.observableusercontent.com/files/efcf234c07ce04b14a0299b6be820dbffa3a570fff1d24eeb22835e30adf8574e93a4e39cb799b4a093dd084e49fc13b05f7bf61cef02e2edf9576b4d1d4af0e","name":"Influenza_NH.csv","type":"text/csv","lastModified":1714026046511.774,"size":2032},{"id":"47c08428851acb119e11a4c503ca2babcc0065e6c2eb4bfc5fb70cface709667440b9d0b5fd152f5d81798c964f58610cfbb24c652ff3277fe01f2af0a3ef76d","href":"https://static.observableusercontent.com/files/47c08428851acb119e11a4c503ca2babcc0065e6c2eb4bfc5fb70cface709667440b9d0b5fd152f5d81798c964f58610cfbb24c652ff3277fe01f2af0a3ef76d","name":"Influenza_NH_Post_COVID.csv","type":"text/csv","lastModified":1714026046511.814,"size":1315},{"id":"3e101fc20b2cdf34784fd1c73b599129efb49c83d7a6d1265795c30c7015ad90de186a860a357412e32ce61dfcf448aefa92d8160e1fcc3f677d9bcce42394af","href":"https://static.observableusercontent.com/files/3e101fc20b2cdf34784fd1c73b599129efb49c83d7a6d1265795c30c7015ad90de186a860a357412e32ce61dfcf448aefa92d8160e1fcc3f677d9bcce42394af","name":"Influenza_NH_Pre_COVID.csv","type":"text/csv","lastModified":1714026046511.015,"size":592},{"id":"f4dee467c9f0b5d2faccaf1a9c8cc12189641eacd88871d276003ccb319e821eda9aaa0ba36dcb691d17a597dabbff764e7ad4aa65046cde6a52c152792391ca","href":"https://static.observableusercontent.com/files/f4dee467c9f0b5d2faccaf1a9c8cc12189641eacd88871d276003ccb319e821eda9aaa0ba36dcb691d17a597dabbff764e7ad4aa65046cde6a52c152792391ca","name":"Influenza_SH.csv","type":"text/csv","lastModified":1714026046515.82,"size":1899},{"id":"db505aa848a718b27daa201be554de5f4c865e43c0f2bba89c6b2b420171bccac5041acb9af12d5750abde2b30a283a89aa1dcfa38fb3e914b3e155206a3fa49","href":"https://static.observableusercontent.com/files/db505aa848a718b27daa201be554de5f4c865e43c0f2bba89c6b2b420171bccac5041acb9af12d5750abde2b30a283a89aa1dcfa38fb3e914b3e155206a3fa49","name":"Influenza_SH_Post_COVID.csv","type":"text/csv","lastModified":1714026046513.095,"size":1236},{"id":"994a6508d98f3d0ccf91b50b176d316a8aa78fbe59e64c19254fc41cdde677c9e8a6a066eace8a4e2a55ecf11b9dd3aecf5d4273cfa16b52f55e003abbdd16db","href":"https://static.observableusercontent.com/files/994a6508d98f3d0ccf91b50b176d316a8aa78fbe59e64c19254fc41cdde677c9e8a6a066eace8a4e2a55ecf11b9dd3aecf5d4273cfa16b52f55e003abbdd16db","name":"Influenza_SH_Pre_COVID.csv","type":"text/csv","lastModified":1714026046511.264,"size":544}] 41:{"id":"7f2b2e36c35f014f","slug":null,"title":"CS725 - Information Visualization","thumbnail":"932a611e5af68c3f6b256441b924fd7934a9bb3745d99d34f580b1ae724e2cb1","access_level":"public","create_time":"$D2024-04-24T22:55:33.744Z","update_time":"$D2024-04-26T19:19:24.353Z","view_time":null,"first_public_time":"$D2024-05-04T16:42:51.537Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"602302f81e633bd9","login":"maazhasnainkhan-ws","name":"maazhasnainkhan's Workspace","avatar_url":"https://avatars-next.observableusercontent.com/0bcb54695e5fcd7984fd6496aa0319ba89346bab66c062a1e107bc1022ff03a9","tier":"starter_2024","bio":""},"version":178,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"f41a27a56074db9c","login":"maazhasnainkhan","name":"Maaz Hasnain Khan","avatar_url":"https://avatars-next.observableusercontent.com/092e3863feea5d8c147a85bbad299b34fb560a1c42349eab791599521574f705","tier":null,"bio":""}],"members":[{"type":"individual","id":"f41a27a56074db9c","login":"maazhasnainkhan","name":"Maaz Hasnain Khan","avatar_url":"https://avatars-next.observableusercontent.com/092e3863feea5d8c147a85bbad299b34fb560a1c42349eab791599521574f705","tier":null,"role":"editor"},{"type":"team","id":"602302f81e633bd9","login":"maazhasnainkhan-ws","name":"maazhasnainkhan's Workspace","avatar_url":"https://avatars-next.observableusercontent.com/0bcb54695e5fcd7984fd6496aa0319ba89346bab66c062a1e107bc1022ff03a9","tier":"starter_2024","role":"viewer"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"CS725 - Information Visualization","cells":[{"id":0,"value":"# CS725 - Information Visualization","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":12,"value":"# Interactive Dashboard Visualization Project Report","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":14,"value":"## Introduction","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":39,"value":"$43","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":16,"value":"## Data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":42,"value":"$44","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":48,"value":"### Data Wrangling","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":50,"value":"The data initially acquired through FluNet was highly disorganized and presented significant challenges for analysis. To address this, I used Python to clean the data, applying various data science techniques to filter and validate its integrity.\n\nAfter significant data processing, I filtered the dataset into a concise format, focusing on the years 2015 to 2022. This refined dataset included information on specimen tested for influenza, positive and negative influenza cases, and was segmented by Northern or Southern Hemisphere regions.\n\nFinally, I calculated the average for the years 2015 to 2019, representing the pre-COVID era. The years 2020 to 2022 were individually processed as post-COVID era.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":19,"value":"## Visualization","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":87,"value":"viewof Hemisphere = Inputs.select(['Northern Hemisphere', 'Southern Hemisphere'], {label: 'Hemisphere:'});","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":83,"value":"Hemisphere === 'Northern Hemisphere' ? renderNorthernHemisphere() : renderSouthernHemisphere()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":90,"value":"$45","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":21,"value":"## Design Decision","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":166,"value":"$46","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":24,"value":"## Development Process","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":105,"value":"$47","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":26,"value":"## Reference","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":139,"value":"$48","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":68,"value":"## Appendix","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":71,"value":"influenza_nh = await FileAttachment(\"Influenza_NH.csv\").csv({typed: \"auto\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"influenza_nh","database":"$undefined"},{"id":73,"value":"influenza_nh_post_covid = await FileAttachment(\"Influenza_NH_Post_COVID.csv\").csv({typed: \"auto\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"influenza_nh_post_covid","database":"$undefined"},{"id":74,"value":"influenza_nh_pre_covid = await FileAttachment(\"Influenza_NH_Pre_COVID.csv\").csv({typed: \"auto\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"influenza_nh_pre_covid","database":"$undefined"},{"id":75,"value":"influenza_sh = await FileAttachment(\"Influenza_SH.csv\").csv({typed: \"auto\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"influenza_sh","database":"$undefined"},{"id":76,"value":"influenza_sh_post_covid = await FileAttachment(\"Influenza_SH_Post_COVID.csv\").csv({typed: \"auto\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"influenza_sh_post_covid","database":"$undefined"},{"id":77,"value":"influenza_sh_pre_covid = await FileAttachment(\"Influenza_SH_Pre_COVID.csv\").csv({typed: \"auto\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"influenza_sh_pre_covid","database":"$undefined"},{"id":62,"value":"$49","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":65,"value":"$4a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":94,"value":"import {vl} from '@vega/vega-lite-api-v5'","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4b","stdlib":"1"}} 42:"$41:body"