通过URL将Json文件组件加载到Aframe中

时间:2017-07-23 16:43:30

标签: json url model aframe

我正在尝试将地形模型从json文件通过url加载到我的aframe场景。我正在使用其他项目的代码,我无法理解如何使用与它们相同的格式获取json文件URL:

/* global AFRAME, THREE */
AFRAME.registerComponent('ground', {
  schema: {
    url: { default: 'https://cdn.aframe.io/link-traversal/models/ground.json' }
  },
  update: function () {
    var objectLoader;
    var self = this;
    if (this.objectLoader) { return; }
    objectLoader = this.objectLoader = new THREE.ObjectLoader();
    objectLoader.setCrossOrigin('');
    objectLoader.load(this.data.url, function (obj) {
      obj.children.forEach(function (value) {
        if (value instanceof THREE.Mesh) {
          value.geometry.computeFaceNormals();
          value.geometry.computeVertexNormals();
          value.receiveShadow = true;
          value.material.shading = THREE.FlatShading;
        }
      });
      self.el.setObject3D('ground', obj);
    });
  }
});

如何以相同的格式and show this when opened获取我的json文件网址?

1 个答案:

答案 0 :(得分:1)

首先,该文件需要通过https协议提供,或者您无法从链接获取该文件。

如果你想获得一个JSON文件的CDN。(....)链接,你需要将它上传到github,然后将URL粘贴到rawgit上的文件中,你将获得你的文件CDN链接。

您还可以尝试glitch.me,您可以将资源上传到项目中。

如果您有自己的托管,只需在本地链接:/modelDirectory/jsonfile.json

我完全没有采用相同的格式'另外,如果您要问如何将模型转换为JSON,最简单的方法是将其上传到clara.io,并下载three.js JSON导出文件。除此之外,你可以找到一些需要在blender中实现的出口商,比如原来的三个one