# Removing extra edges and blinking faces

**URL:** <https://discourse.threejs.org/t/removing-extra-edges-and-blinking-faces/59431>\
**Category:** Questions\
**Tags:** edgesgeometry, buffergeometry, vertices, geo-json, geometry\
**Created:** [December 19, 2023, 7:34pm UTC](https://discourse.threejs.org/t/removing-extra-edges-and-blinking-faces/59431 "2023-12-19T19:34:12Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![MohsinUddinAbir](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mohsinuddinabir/32/43139_2.png) [@MohsinUddinAbir](https://discourse.threejs.org/u/MohsinUddinAbir)\
**Post date:** [December 19, 2023, 7:34pm UTC](https://discourse.threejs.org/t/removing-extra-edges-and-blinking-faces/59431/1 "2023-12-19T19:34:12Z")

</div>

How can I make 3D polygons with this data? will not overlap any face and no blinking. Without changing any data manually or with conditions without logic that match all other data. Thanks.

```js
// data json
{
    "type": "FeatureCollection",
    "features": [
        {
            "id": "2",
            "type": "Feature",
            "properties": {
                "type": "wall",
                "sf_tilt": 90.0,
                "sf_orient": -32.0
            },
            "geometry": {
                "type": "Polygon",
                "coordinates": [
                    [
                        [
                            2683852.4747061506,
                            1252231.906523199,
                            432.63800066187565
                        ],
                        [
                            2683852.4747061506,
                            1252231.906523199,
                            439.65200066187566
                        ],
                        [
                            2683852.200003838,
                            1252232.076997624,
                            439.39600066187137
                        ],
                        [
                            2683852.200003838,
                            1252232.076997624,
                            435.1080006618714
                        ],
                        [
                            2683850.956000865,
                            1252232.8489994688,
                            435.10800066185215
                        ],
                        [
                            2683850.956000865,
                            1252232.8489994688,
                            433.2940106618521
                        ],
                        [
                            2683852.4747061506,
                            1252231.906523199,
                            432.63800066187565
                        ]
                    ]
                ]
            }
        },
        {
            "id": "5",
            "type": "Feature",
            "properties": {
                "type": "wall",
                "sf_tilt": 90.0,
                "sf_orient": 146.0
            },
            "geometry": {
                "type": "Polygon",
                "coordinates": [
                    [
                        [
                            2683853.20506449,
                            1252236.2645763762,
                            435.108
                        ],
                        [
                            2683854.3609999996,
                            1252235.484,
                            435.108
                        ],
                        [
                            2683854.3609999996,
                            1252235.4839999997,
                            439.3960000002033
                        ],
                        [
                            2683854.6319999998,
                            1252235.301,
                            439.6550000030672
                        ],
                        [
                            2683854.632,
                            1252235.3009999997,
                            433.7652148642271
                        ],
                        [
                            2683853.2050644904,
                            1252236.264576376,
                            433.74104702266015
                        ],
                        [
                            2683853.20506449,
                            1252236.2645763762,
                            435.108
                        ]
                    ]
                ]
            }
        }
    ]
}

```

---

<div class="post-metadata">

**Author:** ![mjurczyk](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mjurczyk/32/10995_2.png) [@mjurczyk](https://discourse.threejs.org/u/mjurczyk)\
**Post date:** [December 24, 2023, 2:31pm UTC](https://discourse.threejs.org/t/removing-extra-edges-and-blinking-faces/59431/2 "2023-12-24T14:31:31Z")

</div>

Depends - what’s the source / format of this data?

---

<div class="post-metadata">

**Author:** ![MohsinUddinAbir](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mohsinuddinabir/32/43139_2.png) [@MohsinUddinAbir](https://discourse.threejs.org/u/MohsinUddinAbir)\
**Post date:** [December 24, 2023, 3:00pm UTC](https://discourse.threejs.org/t/removing-extra-edges-and-blinking-faces/59431/3 "2023-12-24T15:00:03Z")

</div>

All data same format like these 2 features data

---

<div class="post-metadata">

**Author:** ![mjurczyk](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mjurczyk/32/10995_2.png) [@mjurczyk](https://discourse.threejs.org/u/mjurczyk)\
**Post date:** [December 24, 2023, 3:50pm UTC](https://discourse.threejs.org/t/removing-extra-edges-and-blinking-faces/59431/4 "2023-12-24T15:50:47Z")

</div>

Yes - but what produces this JSON? What software does it come from?

Most of the time formats have at least some minimal documentation describing fields, their possible values, and how these values should be interpreted.

Having just a JSON won’t be much help, since you’re free to interpret these “coordinates” in kinda any way - which may work for this specific JSON with these specific values, but break as soon as you try to parse another one.

---

<div class="post-metadata">

**Author:** ![MohsinUddinAbir](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mohsinuddinabir/32/43139_2.png) [@MohsinUddinAbir](https://discourse.threejs.org/u/MohsinUddinAbir)\
**Post date:** [December 24, 2023, 4:34pm UTC](https://discourse.threejs.org/t/removing-extra-edges-and-blinking-faces/59431/5 "2023-12-24T16:34:49Z")

</div>

I think geojson data same format, and only with coordinates, sf\_tilt, and sf\_orient, it is possible to make geometry in threejs.  
Here is a complete data, only have to show walls and roofs  
[data01.json](https://discourse.threejs.org/uploads/short-url/6ssBFvllTVFUjNdHqgK0tmadehb.json) (190.5 KB)

---

<div class="post-metadata">

**Author:** ![mjurczyk](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mjurczyk/32/10995_2.png) [@mjurczyk](https://discourse.threejs.org/u/mjurczyk)\
**Post date:** [December 24, 2023, 6:26pm UTC](https://discourse.threejs.org/t/removing-extra-edges-and-blinking-faces/59431/6 "2023-12-24T18:26:06Z")

</div>

Ah, in that case you should be able to use [ShapeGeometry](https://threejs.org/docs/index.html?q=shape#api/en/geometries/ShapeGeometry) and just use coordinates as points to construct the shape (as per [this](https://datatracker.ietf.org/doc/html/rfc7946#section-3.1.1) and [this](https://datatracker.ietf.org/doc/html/rfc7946#section-3.1.6) paragraphs.) You could technically construct a BufferGeometry by hand, but ShapeGeometry will just be a bit way easier and faster.

---

<div class="post-metadata">

**Author:** ![MohsinUddinAbir](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mohsinuddinabir/32/43139_2.png) [@MohsinUddinAbir](https://discourse.threejs.org/u/MohsinUddinAbir)\
**Post date:** [December 24, 2023, 10:04pm UTC](https://discourse.threejs.org/t/removing-extra-edges-and-blinking-faces/59431/7 "2023-12-24T22:04:19Z")

</div>

Thanks. Maybe this is the actual idea. I tried to make it with shape but couldn’t do it accurate way. If I can get an example code with threejs will help me much.
