three.js中几何体添加纹理，但是纹理图片模糊。

Question

### 问题描述
用three.js绘制一个几何体，几何体有纹理图片，但是图片一致是模糊的

### 问题出现的环境背景及自己尝试过哪些方法
我用svg的图片和之前用png图片显示是一样模糊的，就是将图片的大小调整也不可以
在render中添加这个配置
renderer = new THREE.WebGLRenderer({

        antialias: true,
        alpha: true,
        precision: "highp"
    });
    // 设置窗口尺寸
    console.log(dom.clientWidth)
    renderer.setPixelRatio(window.devicePixelRatio);
    renderer.setSize(dom.clientWidth, dom.clientHeight);
    也没有作用

### 相关代码
粘贴代码文本（请勿用截图）
var w = 380

    var h = 190
    var skyBoxGeometry = new THREE.BoxGeometry(w, h, 0);
    var texture = new THREE.TextureLoader().load("./css/img/earthbg4.png");
    var skyBoxMaterial = new THREE.MeshBasicMaterial({ map: texture, side: THREE.DoubleSide });//
    //var skyBoxMaterial = new THREE.MeshLambertMaterial({ color: 'ff0000' });
    var skyBox = new THREE.Mesh(skyBoxGeometry, skyBoxMaterial);
    skyBox.position.set(0, 0, 0);
    scene.add(skyBox);

### 你期待的结果是什么？实际看到的错误信息又是什么？
并没有报错，这是为什么呢？怎么清楚的显示纹理呢？