0

I want to be able to calculate the area of a given SVG by defining the width, therefor the length too in cm.

It's a not only height*width because it's the SVG is complex shape.

Let's say I have this SVG:

What's the area of this SVG?

How can I calculate it's surface area with HTML/JavaScript, or Python, or Node.JS?

c4b4d4
  • 964
  • 12
  • 32
  • Can you explain why are you giving downpoints? wth haha, it's clearly noticeable the area is not width*height – c4b4d4 Apr 25 '18 at 22:43
  • 1
    What are you defining area as? The sum of all polygon areas? What have you tried? – jhpratt Apr 25 '18 at 22:48
  • @jhpratt SVGs can have paths overlapping other paths so maybe calculating the areas of all the polygons/paths that form the SVG would be wrong, I would need to substract the overlaps and that would make it even more complex. Right now I'm trying to transform the SVG to a PNG, then detect the edges/corners of the PNG, get the coordinates of those corners and then calculate the area of the complex polygon. – c4b4d4 Apr 25 '18 at 22:58
  • [2021] This SO answer calculates the area of **one** ````: https://stackoverflow.com/questions/67873157/scaling-the-filling-portion-of-an-svg-path/68082501#68082501 – Danny '365CSI' Engelman Jun 27 '21 at 09:21

1 Answers1

-2

The surface area of a rectangle is calculated with the following formula:

Area = length * width

It's pretty simple to do this in JavaScript:

var svgWidth = ...
var svgHeight = ...
var svgArea = svgWidth * svgHeight;
console.log("The area of the SVG is " + svgArea);
Ashley Davis
  • 9,896
  • 7
  • 69
  • 87
  • 1
    That's not even close to the correct area sorry. You can clearly see the shape it's not a rectangle, but a complex shape. I'm wondering how to go through all the paths of the SVG and calculate the areas to calculate the whole area. That's the only way that comes to my mind, but I don't know how do do it. Plus, some areas are over other areas and would need to substract them, so maybe there's a a better approach. – c4b4d4 Apr 25 '18 at 22:37
  • Well that isn't clear from your question and it's going to be pretty complicated to compute that from paths. – Ashley Davis Apr 26 '18 at 04:15