The loadXML() function is used to read the contents of a file or URL and return it as a XML object. The file must be present in the sketch directory to be accessed. This method can be used to support file sizes up to 64MB.
This function is asynchronous, therefore it is recommended to be called in the preload() function to ensure that the function is executed before the other functions.
Syntax:
loadXML(filename, callback, errorCallback )
Parameters: This function accepts three parameters as mentioned above and described below:
- filename: This is a string which denotes the file path or URL from where the XML data has to be loaded.
- callback: This is a function which is called when this function executes successfully. The first argument for this function is the XML data loaded from the file. It is an optional parameter.
- errorCallback: This is a function which is called if there is any error in executing the function. The first argument for this function is the error response. It is an optional parameter.
The examples below illustrate the loadXML() function in p5.js:
Example 1:
/* == Contents of books.xml == <book> <name>The Adventures of Sherlock Holmes: Part One</name> <author>Arthur Conan Doyle</author> <price>323</price> <genre>Detective fiction</genre> </book> */ let loadedXML = null; function setup() { createCanvas(500, 200); textSize(22); text("Click on the button below to " + "load XML from file", 20, 20); // Create a button for loading the XML loadBtn = createButton("Load XML from file"); loadBtn.position(30, 50) loadBtn.mousePressed(loadXMLFile); } function loadXMLFile() { // Load the XML from file loadedXML = loadXML('books.xml', onFileload); } function onFileload() { text("XML loaded successfully...", 30, 100); let book = loadedXML.getChildren(); // Get the content of the tags let name = book[0].getContent(); let author = book[1].getContent(); let price = book[2].getContent(); let genre = book[3].getContent(); text("Name: " + name, 30, 140); text("Author: " + author, 30, 160); text("Price: " + price, 30, 180); text("Genre: " + genre, 30, 200); } |
Output:
Example 2:
/* == Contents of movies.xml == <movies> <movie year="1972" director="Francis Ford Coppola"> The Godfather </movie> <movie year="1939" director="Victor Fleming"> The Wizard of Oz </movie> <movie year="1941" director="Orson Welles"> Citizen Kane </movie> </movies> */ let loadedXML = null; function setup() { createCanvas(500, 450); textSize(22); text("Click on the button below to " + "load XML from file", 20, 20); // Create a button for loading the XML loadBtn = createButton("Load XML from file"); loadBtn.position(30, 50) loadBtn.mousePressed(loadXMLFile); } function loadXMLFile() { // Load the XML from file loadedXML = loadXML('movies.xml', onFileload); } function onFileload() { // Get the children with the "movie" tag let children = loadedXML.getChildren('movie'); for (let i = 0; i < children.length; i++) { // Get the content of the tag let name = children[i].getContent(); // Get a numerical attribute let year = children[i].getNum('year'); // Get a string attribute let director = children[i].getString('director'); text("Name: " + name, 30, 100 + i * 80); text("Year: " + year, 30, 120 + i * 80); text("Director: " + director, 30, 140 + i * 80); } } |
Output:
Online editor: https://editor.p5js.org/
Environment Setup: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/
Reference: https://p5js.org/reference/#/p5/loadXML
Whether you’re preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, neveropen Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we’ve already empowered, and we’re here to do the same for you. Don’t miss out – check it out now!
