Image Texture On SphereGeometry

Questions
1

I want to achieve this using Three js.
[Uploading: Screen Shot 2019-10-07 at 14.46.26.png…](See the red lines beside image).

Instead of this I am having this texture on my sphere.
[Uploading: Screen Shot 2019-10-07 at 14.46.10.png…](This is without red line)

I am using the following code.

 this.scene = new THREE.Scene();
this.geometry = new THREE.SphereGeometry( 0.4, 100, 100 );
var texture = new THREE.TextureLoader().load('assets/Webp.png');
this.material = new THREE.MeshBasicMaterial({map : texture, overdraw: 0.1});
this.mesh = new THREE.Mesh( this.geometry, this.material );
this.scene.add( this.mesh );

Any Help will be appreciated.

Detail question on stackoverflow:

2

I suggest you study how the equirectangular environment map is applied in this official example:

https://threejs.org/examples/webgl_materials_envmaps

BTW: Material.overdraw has been deprecated. It was only relevant in context of CanvasRenderer which has been removed for a while now.

3

I think this is not environment mapping what I am looking for. Environment mapping is the reflection of background on the object.