首页 > 其他分享 >pyecharts实现点击省跳转省地图

pyecharts实现点击省跳转省地图

时间:2024-04-15 20:45:45浏览次数:33  
标签:case pyecharts href 地图 break 点击 html location 跳转

诶呀我去太感谢了终于找到实现点击地图省份实现跳转了。

参考:利用pyecharts实现中国省与市之间的跳转_pyecharts点击地图跳转-CSDN博客

 

需要注意的问题:

1.如果想在全国地图显示数据,data数据中要用如:北京市、广东省、香港特别行政区、内蒙古自治区,这种带有后缀的。(可能有些不需要后缀也可以显示数据,但是我的就是显示不出来,必须带有后缀才显示出来了)

2.如果要生成省地图,给入的数据要用:北京、广东、香港、内蒙古,这种不带后缀的。

GDP.csv数据(我乱打的数据)

province,class
黑龙江省,1
吉林省,23
辽宁省,4
河北省,3
甘肃省,24
青海省,46
陕西省,3
河南省,23
山东省,14
山西省,23
安徽省,45
湖北省,67
湖南省,32
江苏省,44
四川省,35
贵州省,36
云南省,78
浙江省,134
江西省,24
广东省,124
福建省,45
台湾省,56
海南省,78
新疆维吾尔自治区,132
内蒙古自治区,24
宁夏回族自治区,14
广西壮族自治区,134
西藏自治区,25
北京市,134
上海市,453
天津市,67
重庆市,45
香港特别行政区,67
澳门特别行政区,43
View Code

 

python代码:

import pandas as pd
from pyecharts.charts import Map
from pyecharts import options as opts
from pyecharts.globals import ThemeType
import re


data = pd.read_csv('GDP.csv')
province = list(data["province"])
pro_sta=[]  # 去除后缀
clss = list(data["class"])
list = [list(z) for z in zip(province, clss)]
print(province)
print(list)

for i in province:
    # 设置要替换的字符
    i=re.sub('省|市|自治区|壮族自治区|回族自治区|维吾尔自治区|特别行政区','',i)
    # print(i)
    pro_sta.append(i)

#
# maptype='china' 只显示全国直辖市和省级
map = Map(init_opts=opts.InitOpts(width="1500px", height="800px", theme=ThemeType.VINTAGE))  # 添加主题
map.set_global_opts(
    # 标题配置项
    title_opts=opts.TitleOpts(
        title="等级分布地图",
        pos_left="center"
    ),
    # 图例配置项
    legend_opts=opts.LegendOpts(
        is_show=True,
        pos_left="left",
    ),
    # 视觉影射配置项
    visualmap_opts=opts.VisualMapOpts(
        min_=0,  # 组件最小值
        max_=300,
        range_text = ['等级程度分布颜色区间:', ''],  # 两端文本名称
        is_piecewise=True,  # 定义图例为分段型,默认为连续的图例
        pos_top= "middle",  # 组件离容器左侧的距离
        pos_left="left",
        orient="vertical",  # 布局方式为垂直布局,水平为horizon
        split_number=5  # 分成5个区间
    )
)
map.add("程度", list, maptype="china")
map.render("全国.html")


for i in pro_sta:
    province_city = (
        Map(init_opts=opts.InitOpts(width="1500px", height="800px", theme=ThemeType.VINTAGE))
        .add("",
             list,  # 可以自己写一个字典写各个省份下的市所对应的数据,在这里只是一个range()
             i)
        .set_global_opts(
            title_opts=opts.TitleOpts(title=i + "地图"),
            visualmap_opts=opts.VisualMapOpts(
                min_=0,
                max_=300,
                is_piecewise=True
            )
        )
        .render(path=i + "地图.html")
    )

在生成的全国.html中添加代码:

注意

1.需要将代码中  chart_  后面的一串东西改成自己生成的  全国.html 中  <div id=""></div> 中id的数字

2.这一串代码要放在<script></script> 中的最后!!!

 

chart_00f5b25356cf4f7cb940622bca787821.on('click', function (param){
            var selected = param.name;
                if (selected) {
                    switch(selected){
                        case '北京市':
                            location.href = "./北京地图.html";
                            break;
                        case '上海市':
                            location.href = "./上海地图.html";
                            break;
                        case '天津市':
                            location.href = "./天津地图.html";
                            break;
                        case '四川省':
                            location.href = "./四川地图.html";
                            break;
                        case '安徽省':
                            location.href = "./安徽地图.html";
                            break;
                        case '山东省':
                            location.href = "./山东地图.html";
                            break;
                        case '江苏省':
                            location.href = "./江苏地图.html";
                            break;
                        case '江西省':
                            location.href = "./江西地图.html";
                            break;
                        case '河北省':
                            location.href = "./河北地图.html";
                            break;
                        case '浙江省':
                            location.href = "./浙江地图.html";
                            break;
                        case '海南省':
                            location.href = "./海南地图.html";
                            break;
                        case '湖北省':
                            location.href = "./湖北地图.html";
                            break;
                        case '湖南省':
                            location.href = "./湖南地图.html";
                            break;
                        case '广东省':
                            location.href = "./广东地图.html";
                            break;
                        case '福建省':
                            location.href = "./福建地图.html";
                            break;
                        case '甘肃省':
                            location.href = "./甘肃地图.html";
                            break;
                        case '广西壮族自治区':
                            location.href = "./广西地图.html";
                            break;
                        case '贵州省':
                            location.href = "./贵州地图.html";
                            break;
                        case '河南省':
                            location.href = "./河南地图.html";
                            break;
                        case '黑龙江省':
                            location.href = "./黑龙江地图.html";
                            break;
                        case '内蒙古自治区':
                            location.href = "./内蒙古地图.html";
                            break;
                        case '吉林省':
                            location.href = "./吉林地图.html";
                            break;
                        case '辽宁省':
                            location.href = "./辽宁地图.html";
                            break;
                        case '宁夏回族自治区':
                            location.href = "./宁夏地图.html";
                            break;
                        case '青海省':
                            location.href = "./青海地图.html";
                            break;
                        case '山西省':
                            location.href = "./山西地图.html";
                            break;
                        case '陕西省':
                            location.href = "./陕西地图.html";
                            break;
                        case '台湾省':
                            location.href = "./台湾地图.html";
                            break;
                        case '西藏自治区':
                            location.href = "./西藏地图.html";
                            break;
                        case '新疆维吾尔自治区':
                            location.href = "./新疆地图.html";
                            break;
                        case '云南省':
                            location.href = "./云南地图.html";
                            break;
                        case '重庆市':
                            location.href = "./重庆地图.html";
                            break;
                        case '香港特别行政区':
                            location.href = "./香港地图.html";
                        case '澳门特别行政区':
                            location.href = "./澳门地图.html";
                        default:
                            break;
                    }

            }
      });

实现效果:

 点击跳转

 

标签:case,pyecharts,href,地图,break,点击,html,location,跳转
From: https://www.cnblogs.com/hmy22466/p/18114494

相关文章

  • HarmonyOS-基础之页面跳转
    1、配置页面路由信息resources-->base-->profile-->main_pages.json{"src":["pages/demo03/Index","pages/demo03/Detail"]}2、编写页面组件Index.ets/***路由跳转*-使用鸿蒙内置的router*/importrouterfrom'......
  • ABP后台管理页面AdminLTE框架,实现菜单项点击后,菜单展开当前菜单项高亮
    <style>.CurrentMenuColor{background-color:#007bff;color:#fff;}</style><script>//左侧菜单定位$(document).ready(function(){varpathname=window.location.pathname+window.location.search;......
  • 默认显示三张,第一张和第三张只显示一半,中间全部显示,点击可左右切换默认显示一二张
     项目地址:https://github.com/holiday0912/SwiperPreView   varswiper=newSwiper(".swiper-container",{autoplay:false,loop:true,initialSlide:2,spaceBetween:20,centeredSlides:true,slidesPerView:1.9,p......
  • IDEA中使用tomcatconfiguration做服务器后,无法从html跳转到servlet的原因
    就我的项目而言,因为我没有用maven中的tomcat插件,用的是IDEA中的tomcatconfiguration,所以刚启动服务器生成的网址是http://localhost:8080/brand_demo_war/,而因为我的项目叫brand-demo,servlet叫做selectAllServlet,所以正常情况浏览器跳转到该servlet后的url应该是http://localhos......
  • 想请教一下,selenium可以做到点击这个继续嘛?
    大家好,我是Python进阶者。一、前言前几天在Python钻石交流群【盼头】问了一selenium的问题,问题如下:想请教一下,selenium可以做到点击这个继续嘛?二、实现过程这里【此类生物】给了一个解答:可以,switchtoalert。顺利地解决了粉丝的问题。如果你也有类似这种Python相关的小问......
  • html中image 区域点击的优点
    在HTML中,图像(image)区域可以被用作交互元素,通过点击操作可以实现多种功能和优点。以下是点击图像区域的一些优点:用户友好的交互:图像是一种直观的视觉元素,用户很容易理解和与之交互。点击图像可以触发预定义的动作或事件,如导航到另一个页面、放大图片、播放视频等,这提供了一......
  • Android 点击按钮跳转
    packagecom.example.helloworld;importandroidx.appcompat.app.AppCompatActivity;importandroid.content.Intent;importandroid.net.Uri;importandroid.os.Bundle;importandroid.view.View;importandroid.widget.Button;publicclassMainActivityextendsA......
  • 2-48. 实现鼠标选中物品后的场景点击事件流程
    修改CursorManager修改EventHandler修改Player修改GridMapManager继续修改CursorManager继续修改EventHandler我们希望人物扔出东西的时候,不是直接在地面上生成一个物品,而是有一个扔的效果修改ItemManager修改InventoryManager继续修改GridMapMa......
  • 点击按钮框来选择相应信息(Vue + Java)
    目录前言1.前端2.后端3.总结前言从Java转全栈,对于项目中的功能,从无到有,都会以笔记的形式记录,方便自身的总结以及翻阅原先的知识点参考:java框架零基础从入门到精通的学习路线附开源项目面经等(超全)前后端实现下拉框带条件查询(Vue+Java)通过点击按钮框给予数据选......
  • echarts可拖拽折线图,拐点拖拽/点击定位/整体平移
    1.拐点拖拽,只有点击拐点才可以拖拽,并且限制了只能在当前X轴进行拖拽//chart myChart(){ constthat=this letsymbolSize=20; letdata=newArray(); letdataReal=newArray(); //this.real letlist=this.plan; letr......