一丶簡介
本次說的是前端的可視化的內容，主要就是簡單的3D地球的繪制，現在越來越多的插件和腳本涌入互聯網，人們開始越來越不用造輪子了。今天我們就是介紹一個好用的可視化插件。echarts（百度出品）。
二丶內容
我是用的python自帶的web服務寫的，廢話不多說，直接貼代碼
```
def map():
print("context-Type: text/html")
print()
print("""
<!doctype html>
<html>
<head>
<meta charset="gb2312">
<script src="../static/echarts.js"></script>
<script src="../static/echarts-gl.js"></script>
<title>3D地球</title>
<style>
*{
margin:0px;
padding:0px;
}
</style>
</head>
<body>
<div id="main" style="width:100%; height:100%;"></div>
</body>
<script>
var main = document.getElementById("main")
var winheight = window.innerHeight;
main.style.height = winheight+"px";
</script>
<script type="text/javascript">
var echart = echarts.init(document.getElementById("main"));
var option = {
backgroundColor: '#000',
globe: {
baseTexture: "../static/world-map.jpg",
heightTexture: "../static/world-map.jpg",
displacementScale: 0.04,
shading: 'realistic',
environment: '../static/background.jpg',
realisticMaterial: {
roughness: 0.9
},
postEffect: {
enable: true
},
light: {
main: {
intensity: 5,
shadow: true
},
ambientCubemap: {
diffuseIntensity: 0.2
}
}
}
};
echart.setOption(option)
</script>
</html>
""")
map()
```
啟動python的web服務就可以在瀏覽器中輸入
localhost:8000/cgi-bin/map.py
就可以訪問了
效果圖：
需要資料與源碼關注公眾號回復“地球”：
