Project Title: Demonstrating Various Chart Functionalities
Project Overview: This sample project showcases the implementation of three distinct chart functionalities, each using specific technologies and data sources:
Vega-Lite Bar Chart Embedded in a D3.js Container: Description: This feature presents a bar chart created with Vega-Lite, which is seamlessly embedded within a container managed by D3.js. Purpose: The objective is to demonstrate the integration of Vega-Lite, a declarative visualization grammar, within the D3.js environment, offering a combined visualization solution.
D3.js Bar Chart with Data from a Hardcoded Array: Description: A bar chart is constructed using D3.js, and its data, comprising bar values and labels, is sourced from a pre-defined array. Additionally, interactive highlighting is implemented when the mouse hovers over the bars. Purpose: This functionality illustrates the creation of a basic D3.js bar chart, emphasizing the dynamic response to user interactions through highlighting.
D3.js Line & Point Chart with Data from a Bitcoin API: Description: This feature showcases a line and point chart created using D3.js, with data retrieved via an API call to access real-time Bitcoin price information. Highlighting is applied when the mouse is positioned over the data points. Purpose: The objective is to demonstrate the integration of external data, specifically Bitcoin price data, into a D3.js chart, providing a real-world data visualization scenario. The project incorporates a structured HTML layout, external CSS styles, and JavaScript code to achieve these functionalities, offering a comprehensive illustration of data visualization techniques with Vega-Lite and D3.js.
