Jump to content

game.cache.getJSON(...) is undefined


Recommended Posts

Guys, I'm trying to localize my game using an external JSON file.


It looks like this (justa a sample):

// file lang.js{   "en":{"Play" : "Play", "About" : "About", "Help" : "Help"},   "es":{"Play" : "Jugar", "About" : "Acerca", "Help" : "Ayuda"}};

In preloader I have the following code:

game.load.json('lang', 'lang.json');

And tried to use it as follow:

var lang = game.cache.getJSON('lang').layers[0];

When I run the program I get the error

TypeError: game.cache.getJSON(...) is undefined

Does anyone knows what may I be doing wrong?

Link to comment
Share on other sites

I'm not sure why you're trying to retrieve a "layers" property from the return value of getJSON. You should be able to retrieve the translations directly by key:

var translations = game.cache.getJSON('lang');var english = translations['en'];var spanish = translations['es'];game.debug.text(english['Play'], someX, someY); // should display 'Play'game.debug.text(spanish['Play'], someOtherX, someOtherY); // should display 'Jugar'

You might also want to remove the trailing semicolon from your JSON file if it has one.

Link to comment
Share on other sites

  • 2 years later...

Kick this thread up because I'm also working on localisation. I just wanted to add that you could also just include the translation in your source code as a static variable, instead of loading a separate .json datafile. So something like this:

var langtexts = {
  "SupportedLanguages": {
    "en": "ENGLISH",
    "de": "DEUTSCH",
    "nl": "NEDERLANDS"

  "Start game": {
    "en": "Start game",
    "de": "Spiel starten",
    "nl": "Start spel"

  "ResetGameSure": {
    "en": "This will reset all solved puzzles. Are you sure?",
    "de": "Möchten Sie Ihren Fortschritt wirklich zurücksetzen?",
    "nl": "Hiermee wis je alle opgeloste puzzels. Zeker weten?"
  "Yes": {
    "en": "Yes",
    "de": "Ja",
    "nl": "Ja"
  "No": {
    "en": "No",
    "de": "Nein",
    "nl": "Nee"
  // ..etc.

And then use it like so:

//  get language, for example 'en-US', 'fr', 'it', 'zh' etc.
var selectedlanguage = navigator.language || navigator.userLanguage;

// Keep only first two characters, for example 'en-US' -> 'en'
selectedlanguage = selectedlanguage.substring(0, 2);

// check if this is a supported language
var checks = langtexts.SupportedLanguages[selectedlanguage];
// defaults to english when not supported
if (typeof checks === 'undefined') selectedlanguage = 'en';

// get some texts
var str = langtexts.ResetGameSure[selectedlanguage];
console.log('language test -> str=' + str);

As for the layout of the Phaser game using bitmapfonts, you can expand the bitmap fonts to easily center them in the screen, like so:

// expand the bitmap text object
Phaser.BitmapText.prototype.makeCentered = function(xCenter)
    this.x = Math.floor(xCenter - (this.textWidth*0.5));

// center text
var bmptext = this.game.add.bitmapText(100,200,"myfont",str,40);
bmptext.makeCentered(320); // center around 320px

Or expand the Phaser buttons to contain text, see here

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...