问题
I've used Facetype.js to convert a ttf font to a js font for three.js however I'm getting a number of duplicate point errors like so:
THREE.Shape: Duplicate point 41.52:10.928 THREE.ShapeUtils: Unable to triangulate polygon! in triangulate()
How do I fix these issues?
回答1:
Either remove the duplicates from your geometry before you do the triangulation or use a different triangulation library for example earcut.js.
Earcut is less sensitive for flaws in your geometry definition (like duplicate points or intersecting edges). You can easily use a different triangulation library using an adapter that I made and shared here on GitHub.
Just download the dependencies and do:
THREE.Triangulation.setLibrary( THREE.Triangulation.libraries.earcut );
With switching to earcut you will (most likely) also get some performance increase.
Note: As long as your geometry looks fine you don't really need to worry about these error messages and you could just decide to ignore them as well.
回答2:
@Wilt, works well. Worth pointing out to anyone using this library that if you are using it with earcut and you have already built your own renderer/environment/lights etc. then all you need to do is include the following:
<!-- include the earcut triangulation library -->
<script type="text/javascript" src="earcut.js"></script>
<script type="text/javascript" src="triangulation.js"></script>
<script type="text/javascript" src="viewers/loader.js"></script>
and then set the library as mentioned at the start of your script.
/* set the triangulation library to earcut */
THREE.Triangulation.setLibrary( THREE.Triangulation.libraries.earcut );
来源:https://stackoverflow.com/questions/36692985/duplicate-points-in-three-js-font