Question

我正在使用json文件创建地图。 d3.js到Three.js。如图所示，它显示为颠倒。我可以转过身吗？我不确定哪种翻转方式最好。我想尽可能地推荐它，因为我是d3和Three.js的新手，不知道该怎么做。

在这里你可以看到它的外观：

所以我需要： http://vignette3.wikia.nocookie.net/inciclopedia/images/b/b4/Mapamundi.png/revision/20130430135955

我的代码是：

            mercator = d3.geo.equirectangular();
            path = d3.geo.path().projection(mercator);

            var translate = mercator.translate();
            translate[0] = 500;
            translate[1] = 0;

            mercator.translate(translate);
            mercator.scale(200);


            var data=jsonCountrys;
            var countries = [];
            var i, j;

            // convert to threejs meshes
            for (i = 0 ; i < data.features.length ; i++) {
                var geoFeature = data.features[i];

                var properties = geoFeature.properties;
                var feature = path(geoFeature);

                // we only need to convert it to a three.js path
                var mesh = transformSVGPathExposed(feature);

                // add to array
                for (j = 0 ; j < mesh.length ; j++) {
                      countries.push({"data": properties, "mesh": mesh[j]});
                }
            }

            var material= new Array();
            // extrude paths and add color
            for (i = 0 ; i < countries.length ; i++) {

                // create material color based on average   
                 material[i] =  new THREE.MeshBasicMaterial( { color: "#FF0000" });

            //  var material = new THREE.MeshPhongMaterial({
                    color: "#FF0000"/*, 
                    opacity:0.5*/


                // extrude mesh
                var shape3d = countries[i].mesh.extrude({
                    amount: 2, 
                    bevelEnabled: false
                });

                 var  materialSide = new THREE.LineBasicMaterial( { color: "#000000"} ); 
                           country[i] = new THREE.Mesh(shape3d, material[i]);

Answer 1

不知道您的许多参数在此代码段的外部是什么，但是如果您在创建material的同时创建了一个翻转矩阵，例如

var material= new Array(); // you already have this
var flip = new THREE.Matrix4().makeScale(1,-1,1);

然后在致电shape3d之前将其应用于new THREE.Mesh()：

shape3d.applyMatrix(flip);

这应该可以解决问题。

另外：此处也应该小心，当你真正使用LineBasicMaterial并正确设置边和线框属性时，你正在使用MeshBasicMaterial。

我怎么能把一个颠倒的数字？

1 个答案: