WebGL如何解决中文文字载入

标签：

   关于WebGL载入中文字体问题，我在网上搜了一下，发现例子并不多，而且只能实现隶书的载入，不支持其他中文字体。

   下面是实现的代码：

<script src="../js/three.min.js"></script>    

<!-- load the font file from canvas-text -->    

<script src="../Script/lisu_regular.typeface.js"></script>      

<script>

        var container, camera, scene, renderer;        

       var group, text;

        init();        

       animate();

        function init() {

            container = document.createElement(‘div‘);            

            document.body.appendChild(container);

            camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 1, 10000);            

           camera.position.set(0, 150, 500);

            scene = new THREE.Scene();

            // Get text from hash            

            var theText = "你好，文字！";

            var hash = document.location.hash.substr(1);              

           if (hash.length !== 0) {                 theText = hash;             }

            var text3d = new THREE.TextGeometry(theText, {

                size: 40,                

                height: 10,                

                curveSegments: 2,                

                 font: "lisu"                

                });

        text3d.computeBoundingBox();

        text = new THREE.Mesh(text3d, new THREE.MeshBasicMaterial({ color: 0xFD7B01}));        

       text.position.set(-200,200, 0);         text.rotation.y = Math.PI * 2;

        group = new THREE.Object3D();        

        group.add(text);

        scene.add(group);

        renderer = new THREE.CanvasRenderer();        

        renderer.setClearColor(0xf0f0f0);        

         renderer.setSize(window.innerWidth, window.innerHeight);

        container.appendChild(renderer.domElement);

        }        

     function animate() {            

       requestAnimationFrame(animate);            

       renderer.render(scene, camera);        

}

    </script>

  核心代码也就几行，关键在于导入lisu_regular.typeface.js文件，可以在GitHub上搜索找到。

WebGL如何解决中文文字载入

标签：

原文地址：http://www.cnblogs.com/dh-hui/p/4683073.html