Looking for the lowest element will give you the element at the very bottom along the Z axis, which may not be the desired outcome. Imagine a scenario where the Z order of elements changes, such as by using Element.toBack()
, this could invalidate your search.
Instead, consider a more semantic approach by iterating through the elements array and finding the last element of a specific type (like a circle).
Raphaël also provides the option to extend the default set of functions, allowing you to add a function to the paper element specifically for this purpose. Below is an example of a function that retrieves the last element of a given type from the paper, or false
if no such element is found:
Raphael.fn.last = function(type) {
var element;
this.forEach(function(el) {
if (el.type == type) {
element = el;
}
});
return element || !!element;
};
Make sure to add this function before creating any paper elements. Then, you can simply call it with the desired element type:
var r = Raphael(paper, '100%', '100%');
// ...
// add elements etcetera
// ...
var lastCircle = r.last('circle');
Keep in mind that this approach may be resource-intensive if the paper contains many elements. However, the main goal is to introduce the concept of extending functionality and stimulate your thought process. Feel free to optimize the function for better efficiency.