echarts geo3D結合map3D 生成可以點擊獲取省份信息跳轉(zhuǎn)到相應省份 且地圖顯示省份名稱
先上效果圖
先講下需求:
1.地圖上顯示各個省份的名稱
2.對不同省份進行區(qū)分(項目涉及到省份排名之類的);
3. 點擊進入不同省份 展示各個省份的市區(qū)信息;
4. 在省份地圖上添加marker ;文章來源:http://www.zghlxwxcb.cn/news/detail-600815.html
講下實現(xiàn)思路
1.中國地圖使用geo3d 和scatter3D做文字圖層,用map3d實現(xiàn)點擊可以獲取省份信息,如果單獨使用geo3d,無法獲取到點擊的省份信息。還有一些思路寫在代碼中了。文章來源地址http://www.zghlxwxcb.cn/news/detail-600815.html
上代碼
var dom: any = document.getElementById("container")
myChart = echarts.init(dom);
let geoCoordMap: any = [
{
"name": "北京市", "value": [116.405285, 39.904989, 0] },
{
"name": "天津市", "value": [117.190182, 39.125596, 0] },
{
"name": "河北省", "value": [114.502461, 38.045474, 0] },
{
"name": "山西省", "value": [112.549248, 37.857014, 0] },
{
"name": "內(nèi)蒙古自治區(qū)", "value": [111.670801, 40.818311, 0] },
{
"name": "遼寧省", "value": [123.429096, 41.796767, 0] },
{
"name": "吉林省", "value": [125.3245, 43.886841, 0] },
{
"name": "黑龍江省", "value": [126.642464, 45.756967, 0] },
{
"name": "上海市", "value": [121.472644, 31.231706, 0] },
{
"name": "江蘇省", "value": [118.767413, 32.041544, 0] },
{
"name": "浙江省", "value": [120.153576, 30.287459, 0] },
{
"name": "安徽省", "value": [117.283042, 31.86119, 0] },
{
"name": "福建省", "value": [119.306239, 26.075302, 0] },
{
"name": "江西省", "value": [115.892151, 28.676493, 0] },
{
"name": "山東省", "value": [117.000923, 36.675807, 0] },
{
"name": "河南省", "value": [113.665412, 34.757975, 0] },
{
"name": "湖北省", "value": [114.298572, 30.584355, 0] },
{
到了這里,關于echarts geo3D結合map3D 生成可以點擊獲取省份信息跳轉(zhuǎn)到相應省份 且地圖顯示省份名稱的文章就介紹完了。如果您還想了解更多內(nèi)容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關文章,希望大家以后多多支持TOY模板網(wǎng)!