文本文件导入在EaselJS中不起作用

Question

我需要将EaselJS用于项目并导入一些字体。

我想改用谷歌字体，但你需要WiFi，我的项目不需要WiFi。

我尝试在CSS中导入字体 -

    @font-face {

        font-family: Sample;
        src: url(font/Organo.ttf);

    }

然后我使用EaselJS制作了一些文字 -

    var txt = new createjs.Text();
    txt.x = txt.y = 500;
    txt.font = "96px Sample";
    txt.color = "#FF7700";
    txt.text = "Hello World!";

    stage.addChild(txt);
    stage.update();

控制台中没有显示错误，但字体看起来像默认的Times New Roman。但是，应该看起来像这样 -

我已尝试使用常规HTML元素，并且在将其导入时似乎运行良好。

我还有其他方法可以在EaselJS中导入字体吗？ This是我找到的唯一其他EaselJS字体教程。为什么这个字体不起作用？

Answer 1

字体是否存储在本地？如果是这样，试试

@font-face {

        font-family: Sample;
        src: local("Organo");

    }

否则，请尝试一些引用

@font-face {

    font-family: Sample;
    src: url("font/Organo.ttf");

}

Answer 2

这看起来应该可以正常工作。

确保在加载字体后更新舞台。在示例代码中，您可以在创建文本后更新阶段一次。

以下是从其他域加载字体的快速示例。请注意，在显示实际字体之前，它首先使用默认字体闪烁。

http://jsfiddle.net/bt0hk5wq/

我在舞台上添加了一个刻度线监听器，因此它会不断更新。

createjs.Ticker.on("tick", stage);

PreloadJS中的字体加载已经完成了一些工作，但它仍处于正在进行的分支中：

• FontLoader branch
• FontLoader source
• Font loading example using a font file

FontLoader支持仍处于测试阶段，但希望很快会被整合到官方来源（2016年3月？）

希望有所帮助！