Echarts地图高级开发:下钻交互菜单操作按钮(1)

简介: Echarts地图高级开发:下钻交互菜单操作按钮(1)

CSS样式表

        #menu {
            width: 180px;
            position: relative;
            top: 50px;
        }

点击选择所属省份的链接

<!--交互菜单-->
<div id="menu">
    <span><a href="#" onclick="getCity('shanghai', '上海');">上海</a></span>
    <span><a href="#" onclick="getCity('hebei', '河北');">河北</a></span>
    <span><a href="#" onclick="getCity('neimenggu', '内蒙古');">内蒙古</a></span>
    <span><a href="#" onclick="getCity('zhejiang', '浙江');">浙江</a></span>
</div>

执行封装函数

//构建交互操作菜单;by poleng 2020.09.10
function getCity(provinces, provincesText) {
    //显示返回按钮;
    $('#back').removeClass('hidden');
    mapName = provincesText;
    //显示选择的省份;
    if (provinces) {
        showProvince(provinces, provincesText);
    }
}


Done!

相关文章
|
4月前
|
JSON JavaScript 定位技术
vue中使用echarts实现省市地图绘制,根据数据显示省市天气图标及温度信息
vue中使用echarts实现省市地图绘制,根据数据显示省市天气图标及温度信息
493 1
|
5月前
|
JavaScript 定位技术
echarts地图数据信息流向图效果
本文介绍了如何使用 ECharts 创建一个地图数据信息流向图效果,包括设置地理坐标、线条动画和流向图的实现方法,并通过 Vue.js 封装了一个可重用的 ECharts 地图组件。
256 23
echarts地图数据信息流向图效果
|
4月前
|
资源调度 JavaScript API
vue-element-admin 综合开发五:引入 echarts,封装echarts 组件
这篇文章介绍了如何在vue-element-admin项目中引入并封装ECharts组件,以及如何实现折线图、柱状图和饼图的展示。
240 4
vue-element-admin 综合开发五:引入 echarts,封装echarts 组件
|
4月前
|
JSON JavaScript 前端开发
vue中使用echarts实现省市地图绘制,根据数据在地图上显示柱状图信息,增加涟漪特效动画效果
vue中使用echarts实现省市地图绘制,根据数据在地图上显示柱状图信息,增加涟漪特效动画效果
1051 0
|
6月前
|
数据可视化
Echarts数据可视化开发| 移动效能平台附源码
Echarts数据可视化开发| 移动效能平台附源码
|
6月前
|
数据可视化
Echarts数据可视化开发| 智慧数据平台
Echarts数据可视化开发| 智慧数据平台
|
6月前
|
数据可视化
Echarts数据可视化开发| 智慧营业厅
Echarts数据可视化开发| 智慧营业厅
|
6月前
|
数据可视化
Echarts数据可视化大屏开发| 大数据分析平台
Echarts数据可视化大屏开发| 大数据分析平台
Echarts大屏开发| 智慧物流系统
Echarts大屏开发| 智慧物流系统
Echarts大屏开发|数字化电商场景
Echarts大屏开发|数字化电商场景

热门文章

最新文章