1.前言
前几年刚接触Dash库的时候，Dash生态还不太成熟，做些简单的web还行，复杂的、系统性还是得用flask或django来实现。随着这两年dash的不断迭代更新，以及dash大佬feffery相继开发了feffery_antd_components、feffery_leaflet_components、feffery_antd_charts等库，使用dash搭建web变得相对简单起来。遂来CSDN分享下近期搭建的交互式地图可视化看板。
2.内容
2.1 功能说明
主页面分为地图与图形两个板块，分别有以下功能：
- 地图上分别有左右两侧可收缩面板，左侧面板可进行筛选，作用整个页面，包括地图上的四大指标、点标注、右侧面板标注点的详细信息表、以及下侧对应的图形展示。
- 右侧面板上为标注点的详细信息表，表格内部可进行排序、筛选等功能，不作用于其他数据；点击客户姓名，可在地图上突出其位置。
- 地图上的标注点按照授信金额大小由浅到深，点击每个点可以看到其详细信息。
- 可选择地图左侧的工具栏：矩形、多边形、圆形，对地图上的标注点进行筛选图形筛选，作用到整个页面上的数据。
- 点击左侧箭头可展示侧边栏，可点击其他栏目进入其他版块，目前暂未开发，仅做功能展示。
注：本案例除了经营名称/地址来源于POI数据，其余的姓名、部门、手机号、授信金额与行业等均为虚拟生成。
2.2功能预览
2.2.1 整体页面展示
2.2.2 筛选
在地图左侧面板筛选
可以看到地图上的标注点、右侧面板上的客户信息、以及下侧的图表均发生了变化。
操作gif如下：
2.2.3 地图标注点点击事件
点击地图上的点，可以看到其详细信息
2.2.4 地图标注点与表格交互
点击右侧面上上的客户姓名，可以看到其在地图上的对应位置
2.2.5 地图工具栏筛选
矩形：
圆形：
多边形：
