Skip to content

Conversation

@yuseitahara
Copy link
Contributor

It is essential for non-English users like me to know how to use non-ASCII characters in A-Frame. I added a section about how to generate a custom msdf font to use non-ASCII characters. In my case, it is Japanese characters.

<html>
<head>
<meta charset="UTF-8">
<script src="https://aframe.io/releases/0.8.2/aframe.min.js"></script>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should we use https://aframe.io/releases/latest/aframe.min.js ?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It seems that https://aframe.io/releases/latest/aframe.min.js is deprecated and is permanently pinned to v0.1.3...

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Correct, we do not use latest. People would use latest, then A-Frame upgrades, then hundreds of sites would break instantly.


To use non-ascii characters, you need to create your own custom font. The easiest way is to use [a web-based MSDF tool][msdf-bmfont-web]. Select your required character set and generate your own custom msdf font zip file.

Once you download your custom msdf font zip file, extract it and rename `*.png` to `*-msdf.png`, then put both png and json files to your A-Frame directory.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hm do we know why the PNG needs to be renamed? The filename is listed inside the JSON file; I'm surprised by this. 🤔

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That is because text component loads an image named fontName-msdf.png by default. It does not use image filename in json.

See

return this.data.fontImage || fontSrc.replace(/(\.fnt)|(\.json)/, '.png');

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should we fix text component?

@yuseitahara
Copy link
Contributor Author

Is it okay to merge this PR? Is there anything missing?

@donmccurdy
Copy link
Member

donmccurdy commented Jun 18, 2018

Let's try to fix the text component's reliance on same-name textures: #3651. Otherwise this looks good to me. If that PR will take some time, then I'd prefer to merge this one and recommend that users use the fontImage path rather than relying on our inference of the image URL from the JSON filename.

@ngokevin ngokevin merged commit 2f83bf2 into aframevr:master Jun 22, 2018
@donmccurdy donmccurdy added this to the 0.9.0 milestone Aug 31, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants