47 lines
1.4 KiB
HTML
Executable File
47 lines
1.4 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>3D地球</title>
|
|
<script src="js/echarts.js"></script>
|
|
<script src="js/echarts-gl.js"></script>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="chart" id="main" style="width: 800px; height: 600px;"> 3D地球 </div>
|
|
<script>
|
|
var chartDom = document.getElementById('main');
|
|
var myChart = echarts.init(chartDom);
|
|
var option;
|
|
option = {
|
|
backgroundColor: '#000',
|
|
globe: {
|
|
baseTexture: 'img/world.topo.bathy.200401.jpg',
|
|
heightTexture: 'img/world.topo.bathy.200401.jpg',
|
|
displacementScale: 0.04,
|
|
shading: 'realistic',
|
|
environment: 'img/starfield.jpg',
|
|
realisticMaterial: {
|
|
roughness: 0.9
|
|
},
|
|
postEffect: {
|
|
enable: true
|
|
},
|
|
light: {
|
|
main: {
|
|
intensity: 5,
|
|
shadow: true
|
|
},
|
|
ambientCubemap: {
|
|
texture: 'img/pisa.hdr',
|
|
diffuseIntensity: 0.2
|
|
}
|
|
}
|
|
}
|
|
};
|
|
option && myChart.setOption(option);
|
|
</script>
|
|
</body>
|
|
</html> |