Question

I am using this build of aframe: https://rawgit.com/aframevr/aframe/c9817f2/dist/aframe-master.min.js

I have setup a scene in aframe and loaded it onto my webserver. Via the "a-asset-item" i can load and display .objs .mp3 and images(.png) with #id just fine.

The only thing that s not seeming to work are custom fonts made with hiero. I converted a font into a .fnt and a .png(fontimage) and loaded it like so into the code:

<a-assets>

        <a-asset-item id="akzidenz" src="assets/akzidenz.fnt"></a-asset-item>
        <a-asset-item id="akzidenzimage" src="assets/akzidenz.png"></a-asset-item>
        
<a-assets>

然后我就这样说了。

<a-text id="title" position="0 2 -2" side="double"
        font="#akzidenz"
        fontimage="#akzidenzimage"
        value="This is a Title">
      </a-text>

当我在网站上打开网页时,这一错误在javascript console上显示:

components:text:error Error loading font  #akzidenz

3browser.js:111 components:text:error Error: error parsing font malformed file -- no <pages> element
    at Object.callback (https://rawgit.com/aframevr/aframe/c9817f2/dist/aframe-master.min.js:58:1408)
    at a (https://rawgit.com/aframevr/aframe/c9817f2/dist/aframe-master.min.js:183:1112)
    at o (https://rawgit.com/aframevr/aframe/c9817f2/dist/aframe-master.min.js:183:980)
    at XMLHttpRequest.t (https://rawgit.com/aframevr/aframe/c9817f2/dist/aframe-master.min.js:183:401) 
3(index):1 Uncaught (in promise) Error: error parsing font malformed file -- no <pages> element
    at Object.callback (browser.js:71)
    at a (index.js:62)
    at o (index.js:129)
    at XMLHttpRequest.t (index.js:68)

The text is not displayed. Every other kind of file in assets works. Before I made this, I started out writing examples in glitch and there i pasted the cdn-link directly into it. This worked out.

<a-text id="title" position="0 2 -2" side="double"
        font="https://cdn.glitch.com/1eed6da6-c9da-46d7-bb30-b441a645ff43%2Fakzidenz.fnt?1512042049508"
        fontimage="https://cdn.glitch.com/1eed6da6-c9da-46d7-bb30-b441a645ff43%2Fakzidenz.png?1512042052757"
        value="This is a Title">
      </a-text>

I also tried embedding the direct link like http://www.example.com/.../assets/akzidenz.fnt Then I got a permission error.

Can anyone help me out with this issue? Thanks in advance.

Answer 1

如果你没有这样做的话,就为你的项目开设了一个当地服务器。即便是你拥有一切权利,也由于资产得不到适当服务,却在没有运行的服务器的情况下赢得了拖工。后续行动,该指示开始服务器并观察您的项目。

我做了一些研究,现在看来(我不相信100%)你无法在<条码>a-assets上顶上。 A-Frame希望通过提供你的资源,从XML格式(或向教区)中装上你的字体,看来没有获得所需要的数据。这里的行文 throw出你的错误:

data = data.toString()
var xmlRoot = parseFromString(data)
var pageRoot = xmlRoot.getElementsByTagName( pages )[0]
if (!pageRoot)
  throw new Error( malformed file -- no <pages> element )

如果你通过该名录(贴上当地服务器),就会正确工作,因为该名录将接收星体,然后将其划入XML。

如果说,则你可以最后上载。

My final working code:

<a-assets>
  <img id="akzidenzimg" src="/assets/akzidenz.png">
</a-assets>
<a-sky color="#CCC"></a-sky>
<a-text id="title" position="0 2 -2" side="double"
    font="/assets/akzidenz.fnt"
    fontimage="#akzidenzimg"
    value="This is a Title">
</a-text>

我的多重结构:

.
+-- index.html
+-- assets
|   +--akzidenz.fnt
|   +--akzidenz.png

Answer 2

因此,解决这一问题非常容易。

<a-text id="title" position="0 2 -2" side="double"
    font="assets/akzidenz.fnt"
    fontimage="assets/akzidenz.png"
    value="This is a Title">
</a-text>

ont和tim似乎与资产系统不合作。

Answer 3

so for me, pre-loading <a-assets> didnt help, but what i tried and works was this:

i was already running a node service with aws s3, so i hosted my .json and .png fonts there, and created a GET call like /get-fonts/custom-msdf.json
your client FE just calls the font like this

<a-text
 position="0 0 0"
 font="http://localhost:8080/get-font/fonts/custom-msdf.json"
 negate="false"
 value="this is a sample text"
 color="black"
></a-text>

查阅<代码>.json文档的,请查阅<代码>png的网页:

"pages": [
    "custom.png"
  ],

因此,我们迫切需要在<代码><a-text>上打电话<代码>font-image。

Answer 4

<a-assets>
  <img id="akzidenzimg" src="/assets/akzidenz.png">
</a-assets>
<a-sky color="#CCC"></a-sky>
<a-text id="title" position="0 2 -2" side="double"
    font="/assets/akzidenz.fnt"
    fontimage="#akzidenzimg"
    value="This is a Title">
</a-text>

我使用上述方法进行审判,但有一个错误:

查阅XMLHttpRequest at file http:///D:/assets/custom-msdf.json 索马里再次解放联盟的政策封锁了原产地: 跨血统要求只得到礼宾计划的支持:http://www.o.org/data/co-app-、chrome-extension、chrome、https、chrome-untrusted。

new: problem has been solved Solution: Start local server

npm install -g http-server
// Go to the folder where the file is located
http-server .

如果你掌权, 壳牌,你需要允许这一特征,因为权力赋予。壳牌执行政策不允许使用违约文字。

允许:

Set-ExecutionPolicy RemoteSigned

现有窗口允许:

Set-ExecutionPolicy RemoteSigned -Scope Process

Reason: The resource is accesses is not the local path accessed through the file: protocol. But the aframe is converted into an http request and requests need local fnt file, so local server must be started.

友情链接