# Creating polygons with Geo JSON
**URL:** https://forum.babylonjs.com/t/creating-polygons-with-geo-json/34654
**Category:** Questions
**Created:** [October 10, 2022, 8:25pm UTC](https://forum.babylonjs.com/t/creating-polygons-with-geo-json/34654 "2022-10-10T20:25:38Z")
**Posts on this page:** 7
**Page:** 1
### Author:  [@avanrish](https://forum.babylonjs.com/u/avanrish)
#### Post date: [October 10, 2022, 8:25pm UTC](https://forum.babylonjs.com/t/creating-polygons-with-geo-json/34654/1 "2022-10-10T20:25:38Z")
Hello,
I need to build a roof visualization in 3D and 2D editor, so that users can put solar panels on it etc.
I have an API that gives me basically geo json with polygon coordinates for any part of the roof - data looks like [this](https://pastebin.com/mRe3mDCH). “coordinates” array contains 2 arrays - 1st one is the part of the roof that user wanted to get, and 2nd array is a hole in it. (green is what I want, red is the hole I need to drill in my polygon [Imgur](https://imgur.com/a/BhIyBxF))
What I tried to do is:
- Draw an SVG using D3
- Convert SVG to polygon using [Path to Polygon Converter (betravis.github.io)](https://betravis.github.io/shape-tools/path-to-polygon/)
- Then I put values from that tool into Vector3(x, 0, z) and I received a shape I wanted
The problem started with holes, because I’m using fixed 600x600 svg to get the shape and I can’t determine proper size from Geo JSON that those shapes and holes should have, which meant I ended up with a big square hole that didn’t do anything.
You can see svg outlines in red on top of babel canvas for comparison.
I think my approach there was wrong, but I can’t really think of anything else.
The ultimate goal is to get a one shape that user clicked on the map (like [solcellespesialisten.no](https://solcellespesialisten.no/solkart.html)) and render it, and after user is done adding things on it, then they would see a 3D visualization of the entire roof, so the entire building’s roof, not only the part they clicked (it is the same API). (more or less like [this](https://imgur.com/a/tRMxhsS))
So, the most important thing for me right now is to somehow get holes in a shape, and also get all shapes of building roof and position them in correct place, like on solcellespesialisten.no (for now without rotating, just flat 2d to begin with, but 3d will also be appreciated)
Here is my code ([roof-babylon (github.com)](https://github.com/avanrish/roof-babylon))
and [live demo](https://asd-liart.vercel.app/).
To use other roof than provided by me in that demo, you go to [solcellespesialisten.no](https://solcellespesialisten.no/solkart.html), open Dev Tools and Network Tab, click on a roof on the map and you should see “punkt?Y=AA.AAAAAA&X=BB.BBBBBBB”, click on it → choose “Preview” tab, expand object, and copy Geometri value (just Geometri and paste as a string, not an object)
I’ll appreciate any help,
Thanks in advance
---
### Author:  [@docEdub](https://forum.babylonjs.com/u/docEdub)
#### Post date: [October 11, 2022, 12:42am UTC](https://forum.babylonjs.com/t/creating-polygons-with-geo-json/34654/2 "2022-10-11T00:42:17Z")
The [CSG class](https://doc.babylonjs.com/typedoc/classes/BABYLON.CSG) subtract function may do what you need.
[This playground](https://playground.babylonjs.com/#00ANP5#60) is an example.
---
### Author:  [@avanrish](https://forum.babylonjs.com/u/avanrish)
#### Post date: [October 11, 2022, 7:24am UTC](https://forum.babylonjs.com/t/creating-polygons-with-geo-json/34654/3 "2022-10-11T07:24:57Z")
CSG looks interesting, but as I understand it, it needs already built meshes to subtract one from another and I still can’t really figure out how to make a square/rectangle-ish shape to subtract while maintaining scale and all of that, but thanks.
---
### Author:  [@JohnK](https://forum.babylonjs.com/u/JohnK)
#### Post date: [October 11, 2022, 8:25am UTC](https://forum.babylonjs.com/t/creating-polygons-with-geo-json/34654/4 "2022-10-11T08:25:54Z")
These may be a starting point for you
> **[Irregular Polygons | Babylon.js Documentation](https://doc.babylonjs.com/features/featuresDeepDive/mesh/creation/param/polygon)**
>
> Learn about creating irregular polygons in Babylon.js.
> **[Polygon Mesh Builder | Babylon.js Documentation](https://doc.babylonjs.com/features/featuresDeepDive/mesh/creation/param/polyMeshBuilder)**
>
> Learn how to create polygons with Mesh Builder in Babylon.js.
They only build polygons (with holes) in the xz plane
---
### Author:  [@avanrish](https://forum.babylonjs.com/u/avanrish)
#### Post date: [October 11, 2022, 8:40am UTC](https://forum.babylonjs.com/t/creating-polygons-with-geo-json/34654/5 "2022-10-11T08:40:37Z")
I use this CreatePolygon, but the main problem I have is with size/scaling of the elements, when I use array containing coordinates of my hole the same way I get my large shape (like in live demo), the square is huge and I see its border going through and out of my shape. So I thought someone could have a better idea here to use GeoJSON (e.g. one provided by me) to create it with holes and any advice how to maintain scale between those elements.
---
### Author:  [@JohnK](https://forum.babylonjs.com/u/JohnK)
#### Post date: [October 11, 2022, 12:42pm UTC](https://forum.babylonjs.com/t/creating-polygons-with-geo-json/34654/6 "2022-10-11T12:42:09Z")
The main problem is that the difference between values in the arrays are of the order 0.001 so any polygon you draw with Babylon.js is too small to be noticed. I have dealt with it fairly crudely by trimming of significant figures and enlarging the fraction left. You can see that you do get a polygon this way.
Hopefully you can work on this further. You will need to use the trimmed off part to position your polygons in the correct place.
> **[Babylon.js Playground](https://playground.babylonjs.com/#AARUA6)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes
---
### Author:  [@avanrish](https://forum.babylonjs.com/u/avanrish)
#### Post date: [October 12, 2022, 7:46am UTC](https://forum.babylonjs.com/t/creating-polygons-with-geo-json/34654/7 "2022-10-12T07:46:02Z")
That looks good, like the shape I want. Now I need to get 90 degree angles in that shape, but that’s for me to figure out, thank you!