글꼴을 한 번만로드하는 방법은 무엇입니까? (TS / Three.JS)

AAAAAAAAAA

따라서 동일한 글꼴을 사용하여 20 개의 텍스트 블록을 만들고 싶습니다.

새 TextGeometry는 글꼴이 아직로드되지 않은 경우 오류를 보냅니다.

현재 나는

new THREE.TextGeometry(this.text, {
    font: Object(response) as THREE.Font
} as THREE.TextGeometryParameters);

내부 :

let fontLoader = new THREE.FontLoader();    
fontLoader.load('/fonts/my_font.json', response => {

이 방법은 글꼴이 20 회 (새 텍스트마다 한 번씩)로드되기 때문에 매우 비효율적입니다. 실행 속도가 느려집니다 (테스트를 할 때 짜증이납니다).

글꼴을 한 번만로드하고 var에 저장하고 싶지만 TextGeometry를 생성하기 위해로드 될 때까지 기다리는 방법을 모르겠습니다.

나는 그것이 Observables와 관련이 있다고 생각합니까?

대단히 감사합니다.

죄수 849

예를 들어 다음과 같이 할 수 있습니다.

var manager = new THREE.LoadingManager();
manager.onLoad = function() { // when all resources are loaded
  init();
  render();
}

var font = null;
var loader = new THREE.FontLoader(manager);
loader.load('https://threejs.org/examples/fonts/droid/droid_serif_bold.typeface.json', function(response) {
  font = response;
});

그리고 init():

function init(){
    // create instances of scene, camera and renderer
    ...
    function setText(text, position) { // actually, here you can have any parameters you want for your text
        textGeo = new THREE.TextGeometry(text, {
            font: font,...
    }
}

주요 아이디어는 모든 리소스를 먼저, 나머지는 나중에하는 것입니다.

THREE.LoadingManager () .

jsfiddle

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

laravel 5.3을 한 번만로드하는 방법은 무엇입니까?

분류에서Dev

이미 글꼴이 할당 된 여러 구성 요소의 글꼴을 한 번에 변경하는 방법은 무엇입니까?

분류에서Dev

THREE.js에서 이미지 텍스처가있는 객체에 투명한 구멍을 만드는 방법은 무엇입니까?

분류에서Dev

선명한 글꼴 손실, Windows 7에서 글꼴을 제어하는 것은 무엇입니까?

분류에서Dev

ColladaLoader에 의해로드 된 모델을 Three.js에 저장하는 방법은 무엇입니까?

분류에서Dev

누락 된 언어에 대한 대체 글꼴을 변경하는 방법은 무엇입니까?

분류에서Dev

시스템에 설치된 고유 한 글꼴 이름을 나열하는 방법은 무엇입니까?

분류에서Dev

누락 된 언어에 대한 대체 글꼴을 변경하는 방법은 무엇입니까?

분류에서Dev

선택한 옵션에서 글꼴 색상을 변경하는 방법은 무엇입니까?

분류에서Dev

RecyclerView에서 TextView에 대한 사용자 지정 글꼴을 설정하는 방법은 무엇입니까?

분류에서Dev

Monaco 글꼴을 제거하는 방법은 무엇입니까?

분류에서Dev

Helvetica 글꼴을 설정하는 방법은 무엇입니까?

분류에서Dev

Monaco 글꼴을 제거하는 방법은 무엇입니까?

분류에서Dev

OTF 글꼴을 설치하는 방법은 무엇입니까?

분류에서Dev

글꼴을 더 명확하게 만드는 방법은 무엇입니까?

분류에서Dev

JS 애니메이션을 클릭 한 입력 필드로 제한하는 방법은 무엇입니까?

분류에서Dev

이러한 문자를 표시 할 수있는 글꼴을 찾는 방법은 무엇입니까?

분류에서Dev

한 글꼴의 모든 인스턴스를 다른 글꼴로 변경하는 방법은 무엇입니까?

분류에서Dev

다른 eslint 구성으로 JS 및 TS 파일을 동시에 린트하는 방법은 무엇입니까?

분류에서Dev

사용자에게 한 번만 팝을로드하는 방법은 무엇입니까?

분류에서Dev

three.js-입자를 항상 위로 향하게 만드는 방법은 무엇입니까?

분류에서Dev

THREE.js에서 회전 가능한 솜털 공을 애니메이션하는 방법은 무엇입니까?

분류에서Dev

스택 글꼴 굉장 아이콘을 고정 너비 비 스택 아이콘과 동일한 너비로 만드는 방법은 무엇입니까?

분류에서Dev

three.js의 한 지점에 카메라를 자동으로 초점을 맞추는 방법은 무엇입니까?

분류에서Dev

JavaFx : 'comic sans ms'글꼴을 기울임 꼴로 만드는 방법은 무엇입니까?

분류에서Dev

Three.js : "diffuseMap"및 "roughnessMap"을 "cubeMap"으로 변경하는 방법은 무엇입니까?

분류에서Dev

마우스 휠로 three.js 장면을 확대하는 방법은 무엇입니까?

분류에서Dev

three.js에서 전체 장면에 대한 boundingSphere를 얻는 방법은 무엇입니까?

분류에서Dev

시스템 글꼴을 noto로 설정하는 방법은 무엇입니까?

Related 관련 기사

  1. 1

    laravel 5.3을 한 번만로드하는 방법은 무엇입니까?

  2. 2

    이미 글꼴이 할당 된 여러 구성 요소의 글꼴을 한 번에 변경하는 방법은 무엇입니까?

  3. 3

    THREE.js에서 이미지 텍스처가있는 객체에 투명한 구멍을 만드는 방법은 무엇입니까?

  4. 4

    선명한 글꼴 손실, Windows 7에서 글꼴을 제어하는 것은 무엇입니까?

  5. 5

    ColladaLoader에 의해로드 된 모델을 Three.js에 저장하는 방법은 무엇입니까?

  6. 6

    누락 된 언어에 대한 대체 글꼴을 변경하는 방법은 무엇입니까?

  7. 7

    시스템에 설치된 고유 한 글꼴 이름을 나열하는 방법은 무엇입니까?

  8. 8

    누락 된 언어에 대한 대체 글꼴을 변경하는 방법은 무엇입니까?

  9. 9

    선택한 옵션에서 글꼴 색상을 변경하는 방법은 무엇입니까?

  10. 10

    RecyclerView에서 TextView에 대한 사용자 지정 글꼴을 설정하는 방법은 무엇입니까?

  11. 11

    Monaco 글꼴을 제거하는 방법은 무엇입니까?

  12. 12

    Helvetica 글꼴을 설정하는 방법은 무엇입니까?

  13. 13

    Monaco 글꼴을 제거하는 방법은 무엇입니까?

  14. 14

    OTF 글꼴을 설치하는 방법은 무엇입니까?

  15. 15

    글꼴을 더 명확하게 만드는 방법은 무엇입니까?

  16. 16

    JS 애니메이션을 클릭 한 입력 필드로 제한하는 방법은 무엇입니까?

  17. 17

    이러한 문자를 표시 할 수있는 글꼴을 찾는 방법은 무엇입니까?

  18. 18

    한 글꼴의 모든 인스턴스를 다른 글꼴로 변경하는 방법은 무엇입니까?

  19. 19

    다른 eslint 구성으로 JS 및 TS 파일을 동시에 린트하는 방법은 무엇입니까?

  20. 20

    사용자에게 한 번만 팝을로드하는 방법은 무엇입니까?

  21. 21

    three.js-입자를 항상 위로 향하게 만드는 방법은 무엇입니까?

  22. 22

    THREE.js에서 회전 가능한 솜털 공을 애니메이션하는 방법은 무엇입니까?

  23. 23

    스택 글꼴 굉장 아이콘을 고정 너비 비 스택 아이콘과 동일한 너비로 만드는 방법은 무엇입니까?

  24. 24

    three.js의 한 지점에 카메라를 자동으로 초점을 맞추는 방법은 무엇입니까?

  25. 25

    JavaFx : 'comic sans ms'글꼴을 기울임 꼴로 만드는 방법은 무엇입니까?

  26. 26

    Three.js : "diffuseMap"및 "roughnessMap"을 "cubeMap"으로 변경하는 방법은 무엇입니까?

  27. 27

    마우스 휠로 three.js 장면을 확대하는 방법은 무엇입니까?

  28. 28

    three.js에서 전체 장면에 대한 boundingSphere를 얻는 방법은 무엇입니까?

  29. 29

    시스템 글꼴을 noto로 설정하는 방법은 무엇입니까?

뜨겁다태그

보관