Canvas not rendering makeTiledWorld /worldCamera result

[jbrod22]

I'm following the scrollingWorldExample as best I can.

The imported json and png are actually the url locations of each file. In the image attached the white screen is the renderer. The message is rendered properly but nothing else is.

Sorry about the code formatting. Nothing is working right for me.

'import React, {Component} from 'react'; import {connect} from 'react-redux'; import CanvasStyle from './canvas.scss'; import NewWorld from './assets/newworld.json'; import Tileset from './assets/tileset.png';

class Canvas extends Component {

constructor(props) {
    super(props);
    this.state = {}
}

componentWillReceiveProps() {}

componentDidMount() {
    let camera = {}
    let world = {}
    let g = {}
    let objectsLayer = {}

    let filesToLoad = [NewWorld, Tileset]
    g = hexi(512, 512, setup, filesToLoad, load);
    g.start() 

    function setup() {
        document
            .getElementById('HexiCanvas')
            .appendChild(document.getElementsByTagName('canvas')[0])
        g.fps = 1;
        console.log(PIXI.loader.resources)
        world = g
            .tileUtilities
            .makeTiledWorld(NewWorld, Tileset);
        console.log(g)
        camera = g.worldCamera(world, world.worldWidth, world.worldHeight, g.canvas)
        objectsLayer = world.getObject("Elf");
        let message = g.text("No items found", "12px puzzler", "black");
        message.setPosition(10, 10);
        g.state = play;

    }

    function load() {}

    function play() {
        console.log('Tick Tock!')
        camera.follow(objectsLayer)
    }

}

render() {

    return <div
        className={this.props.show
        ? "canvas"
        : "hidden"}
        id="HexiCanvas"></div>
}

}

const mapStateToProps = (state, ownProps) => { return {}; };

const mapDispatchToProps = (dispatch) => { return {} }

export default connect(mapStateToProps, mapDispatchToProps)(Canvas);'

[kittykatattack]

@jbrod22 If you can get it working by slightly modifying the original example code and then making incremental customizations from there, you might be able to track down what's going wrong. One thing I can tell for sure is that filesToLoad needs to be an array of strings.

[jbrod22]

One thing I can tell for sure is that filesToLoad needs to be an array of strings.

The import NewWorld from './assets/newworld.json'; import Tileset from './assets/tileset.png'; are actually url strings