let petsData = ; let categories = ['Length', 'Height', 'Weight']); let canvasWidth = 800; let canvasHeight = 600; function setup()) { createCanvas(canvasWidth, canvasHeight); // Generate random pet data (30 data points) for (let i = 0; i < 30; i++) { let pet = {Length: random(20, 50), Height: random(10, 30), Weight: random(5, 20)}; petsData.push(pet); } // Draw axes and labels drawAxes(); drawLabels(); // Plot data points plotData(); } function drawAxes() { // Draw X and Y axes stroke(0); line(50, canvasHeight - 50, canvasWidth - 50, canvasHeight -50); line(50, canvasHeight 50, 50, 50); } function drawLabels() { // Draw category labels textSize(16); textAlign(CENTER); for (let i = 0; i < categories.length; i++) { let x = map(1, 0, categories.length ■1, 100, canvasWidth 100); text(categories[i], x, canvasHeight - 20);}} function plotData() { // Plot data points as circles noStroke(); fill(66, 135, 245, 150); // Blue with transparency for (let i = 0; i < petsData.length; i++) { let x = map(1, 0, petsData.length - 1, 100, canvasWidth - 100); let length petsData[i]['Length']; let height = petsData[i]['Height']; let weight = petsData[i][' - - Weight']; // Map values to the canvas space let yLength = map(length, 20, 50, canvasHeight - 50, 50); let yHeight = map(height, 10, 30, canvasHeight - 50, 50); let yWeight = map(weight ' 5, 20, canvasHeight - 50, 50); // Draw a circle at each data point ellipse(x, yLength, 10, 10); ellipse(x, yHeight, 10, 10); ellipse(x, yWeight, 10, 10); } } function draw() { // Additional drawing or interactivity can be added here } CAn someone please help me to put this into JS to get the chart.

Database System Concepts
7th Edition
ISBN:9780078022159
Author:Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Publisher:Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Chapter1: Introduction
Section: Chapter Questions
Problem 1PE
icon
Related questions
Question
let petsData = ; let categories = ['Length', 'Height', 'Weight']); let canvasWidth = 800; let canvasHeight = 600; function setup()) { createCanvas(canvasWidth, canvasHeight); // Generate
random pet data (30 data points) for (let i = 0; i < 30; i++) { let pet = {Length: random(20, 50), Height: random(10, 30), Weight: random(5, 20)}; petsData.push(pet); } // Draw axes and
labels drawAxes(); drawLabels(); // Plot data points plotData(); } function drawAxes() { // Draw X and Y axes stroke(0); line(50, canvasHeight - 50, canvasWidth - 50, canvasHeight -50); line(50,
canvasHeight 50, 50, 50); } function drawLabels() { // Draw category labels textSize(16); textAlign(CENTER); for (let i = 0; i < categories.length; i++) { let x = map(1, 0, categories.length
■1, 100, canvasWidth 100); text(categories[i], x, canvasHeight - 20);}} function plotData() { // Plot data points as circles noStroke(); fill(66, 135, 245, 150); // Blue with transparency for (let i
= 0; i < petsData.length; i++) { let x = map(1, 0, petsData.length - 1, 100, canvasWidth - 100); let length petsData[i]['Length']; let height = petsData[i]['Height']; let weight = petsData[i]['
-
-
Weight']; // Map values to the canvas space let yLength = map(length, 20, 50, canvasHeight - 50, 50); let yHeight = map(height, 10, 30, canvasHeight - 50, 50); let yWeight = map(weight
'
5, 20, canvasHeight - 50, 50); // Draw a circle at each data point ellipse(x, yLength, 10, 10); ellipse(x, yHeight, 10, 10); ellipse(x, yWeight, 10, 10); } } function draw() { // Additional drawing or
interactivity can be added here } CAn someone please help me to put this into JS to get the chart.
Transcribed Image Text:let petsData = ; let categories = ['Length', 'Height', 'Weight']); let canvasWidth = 800; let canvasHeight = 600; function setup()) { createCanvas(canvasWidth, canvasHeight); // Generate random pet data (30 data points) for (let i = 0; i < 30; i++) { let pet = {Length: random(20, 50), Height: random(10, 30), Weight: random(5, 20)}; petsData.push(pet); } // Draw axes and labels drawAxes(); drawLabels(); // Plot data points plotData(); } function drawAxes() { // Draw X and Y axes stroke(0); line(50, canvasHeight - 50, canvasWidth - 50, canvasHeight -50); line(50, canvasHeight 50, 50, 50); } function drawLabels() { // Draw category labels textSize(16); textAlign(CENTER); for (let i = 0; i < categories.length; i++) { let x = map(1, 0, categories.length ■1, 100, canvasWidth 100); text(categories[i], x, canvasHeight - 20);}} function plotData() { // Plot data points as circles noStroke(); fill(66, 135, 245, 150); // Blue with transparency for (let i = 0; i < petsData.length; i++) { let x = map(1, 0, petsData.length - 1, 100, canvasWidth - 100); let length petsData[i]['Length']; let height = petsData[i]['Height']; let weight = petsData[i][' - - Weight']; // Map values to the canvas space let yLength = map(length, 20, 50, canvasHeight - 50, 50); let yHeight = map(height, 10, 30, canvasHeight - 50, 50); let yWeight = map(weight ' 5, 20, canvasHeight - 50, 50); // Draw a circle at each data point ellipse(x, yLength, 10, 10); ellipse(x, yHeight, 10, 10); ellipse(x, yWeight, 10, 10); } } function draw() { // Additional drawing or interactivity can be added here } CAn someone please help me to put this into JS to get the chart.
AI-Generated Solution
AI-generated content may present inaccurate or offensive content that does not represent bartleby’s views.
steps

Unlock instant AI solutions

Tap the button
to generate a solution

Similar questions
  • SEE MORE QUESTIONS
Recommended textbooks for you
Database System Concepts
Database System Concepts
Computer Science
ISBN:
9780078022159
Author:
Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Publisher:
McGraw-Hill Education
Starting Out with Python (4th Edition)
Starting Out with Python (4th Edition)
Computer Science
ISBN:
9780134444321
Author:
Tony Gaddis
Publisher:
PEARSON
Digital Fundamentals (11th Edition)
Digital Fundamentals (11th Edition)
Computer Science
ISBN:
9780132737968
Author:
Thomas L. Floyd
Publisher:
PEARSON
C How to Program (8th Edition)
C How to Program (8th Edition)
Computer Science
ISBN:
9780133976892
Author:
Paul J. Deitel, Harvey Deitel
Publisher:
PEARSON
Database Systems: Design, Implementation, & Manag…
Database Systems: Design, Implementation, & Manag…
Computer Science
ISBN:
9781337627900
Author:
Carlos Coronel, Steven Morris
Publisher:
Cengage Learning
Programmable Logic Controllers
Programmable Logic Controllers
Computer Science
ISBN:
9780073373843
Author:
Frank D. Petruzella
Publisher:
McGraw-Hill Education