Skip to main content
100%

Upcoming assignments from Canvas

✓ Published0🌍 Public
Aal1s
Last edited Aug 14, 2018
Created on Aug 13, 2018

This visualization displays a chronological list of upcoming assignments from the Canvas learning management system, distinguishing between those still requiring submission and those already completed. The code fetches course data via the Canvas API, retrieves assignments filtered by the "upcoming" bucket, then sorts them by due date. Using the Fetch API and JSON parsing, it logs each assignment’s due date, submission status, and URL to the console, with warnings for unsubmitted work. The logic relies on JavaScript’s `Date` object and `toLocaleDateString` for formatting, without any external visualization libraries.

AI-generated description

Similar vizzes

Loading thumbnail…

Adithi_Assignment5

This interactive dashboard displays trends and distributions from a student grades CSV. It presents a dataset summary, bar charts for average scores and grade distribution, a line chart tracking final score trends, and a ranked table of the top five students. The page uses a hover-triggered flip card for summary details, fetches data via the `fetch` API, and constructs the line chart using raw SVG elements within JavaScript. Custom CSS grid layouts and styling structure the dashboard's layout.

Aadithiarikatla@gmail.com
56% match
Loading thumbnail…

Assignment 1

This example demonstrates the visualization of a CTG dataset by loading and displaying its first 10 rows as formatted JSON text on an HTML page. Using D3 v5’s `csv` and `csvFormat` functions via UNPKG, the code fetches external data from a GitHub gist and appends the result to the body as a `pre` element. The page also imports a local ES6 module for a static message, while a background US image and custom CSS styling enhance the presentation.

Lleftymadi
56% match
Loading thumbnail…

Assignment 1-Task10

This example loads a dataset from a GitHub gist and displays the first 10 rows as formatted JSON text. The visualization uses D3 v5, specifically the `csv` function to parse the remote data and the `select` function to append `<pre>` elements to the body. The rendered output is plain text within an SVG container, with custom CSS styling applied to the text elements. The code demonstrates importing D3 utilities and handling asynchronous data loading with a Promise chain.

LLakshmanRangisetti
55% match
Loading thumbnail…

Assignment 5

This example summarizes a laptop dataset by displaying basic file statistics—file size, row count, and column count—as text in the browser. It fetches a CSV file from a GitHub gist, parses it with `d3.csvParse`, and prints the resulting metadata to both the console and the HTML body. A static SVG graphic, created with D3’s `append` and `attr` methods, renders rectangles depicting a stylized laptop shape. The page uses D3 v7 and simple CSS styling to present a minimal, test-oriented view of the data.

GGuntupalli Mohan kalyan
55% match
Loading thumbnail…

Yaswanth_duddu_ICE7

The visualization explores the relationship between student study hours, attendance, assignments, and exam scores using a scatter plot. Each point represents a student, with positions derived from the CSV data and visual encoding mapping study metrics. Rendered using HTML5 Canvas with CSS styling, the plot demonstrates that increased study hours and attendance generally correlate with higher exam performance. A 12em bold message overlays the chart, suggesting a focused narrative element. This example uses Canvas drawing methods and encoded CSV parsing to illustrate academic achievement patterns.

YYaswanth
55% match
Loading thumbnail…

Fetching Data

This example demonstrates how to fetch and aggregate environmental sensor data from the Data Canvas - Sense Your City API using D3, jQuery, and async.js for asynchronous control flow. The visualization retrieves temperature, light, air quality, sound, humidity, and dust readings across multiple cities, then combines the results into CSV format displayed in textareas. It fetches data for the past day, week, month, and 100 days in 5-minute intervals, using the async library’s map and whilst functions to manage API calls while respecting the 1000-row limit. The interface shows live loading indicators and record counters.

CCurran Kelleher
55% match
Loading thumbnail…

Solutions Commits

A Vue-based visualization of a Laravel learning course's git commit history, showing the progression of tasks across four main milestones. The graph displays commit nodes connected by chronological links, with each task's sub-commits branching from their parent task commit. The data comes from a markdown file listing commit SHAs and task groupings. The visualization uses Vue's reactive data binding and SVG rendering to plot nodes and edges, with commit hashes linking to their corresponding GitHub pages. Colors and spacing differentiate task groups, while the overall layout follows the sequential order of commits.

NNaoray
55% match
Loading thumbnail…

Assignment 2 Question 1

An interactive pie chart displays total sales by item category, using data fetched from a remote text file. The visualization is built with Chart.js on an HTML Canvas element, presenting twenty-two categories with distinct colors and a bottom legend. The code calculates and displays percentage values for each slice via the datalabels plugin, summing sales figures parsed from CSV-formatted rows. The chart summarizes category-level sales performance in a single, static view.

Rramsrinivaskatragadda@my.unt.edu
55% match