当前位置：首页 > news >正文

echarts地图添加涟漪波纹点位

news 来源：原创 2025/9/20 13:04:24

1.完整代码

chartsOption: {tooltip: {trigger: "item",formatter: this.initTooltip,triggerOn: "mousemove",borderColor: "#fff",backgroundColor: "rgba(216, 227, 244, 1)",extraCssText: "border-radius: 14px;", // 设置圆角},//用于涟漪波纹点位geo: {map: "china",// 最好这两个都关掉 否则拖拽和缩放会改变地图三点位置// show: true,// roam: true,zoom: 1.2,scaleLimit: {min: 1,},label: {emphasis: {show: false,},},// 地图的背景色itemStyle: {normal: {areaColor: "rgba(255,255,255,1)",shadowColor: "rgba(1,1,1,1)",borderColor: "#fff",borderWidth: 1,shadowColor: "rgba(255, 255, 255, 1)",shadowBlur: 10,shadowOffsetY: 10},},projection: {project: (point) => [(point[0] / 180) * Math.PI,-Math.log(Math.tan((Math.PI / 2 + (point[1] / 180) * Math.PI) / 2)),],unproject: (point) => [(point[0] * 180) / Math.PI, ((2 * 180) / Math.PI) * Math.atan(Math.exp(point[1])) - 90],}},series: [{name: "战区数据",type: "map",map: "china",roam: false,zoom: 1.2,selectedMode: "multiple", // 启用多选scaleLimit: {min: 1,},emphasis: {itemStyle: {areaColor: "rgba(23, 189, 236, 1)", // 高亮状态下的颜色与正常状态相同borderColor: "#fff",borderWidth: 2,shadowBlur: 10, // 阴影模糊效果shadowColor: "rgba(0, 0, 0, 0.5)", // 阴影颜色shadowOffsetX: 0, // 阴影水平偏移shadowOffsetY: 5, // 阴影垂直偏移（实现“变高”效果）},label: {show: false,},},itemStyle: {borderColor: "#fff",borderWidth: 2,},select: {itemStyle: {areaColor: "rgba(23, 189, 236, 1)", // 选中时的颜色borderColor: "#fff",borderWidth: 2,shadowBlur: 10, // 阴影模糊效果shadowColor: "rgba(0, 0, 0, 0.5)", // 阴影颜色shadowOffsetX: 0, // 阴影水平偏移shadowOffsetY: 5, // 阴影垂直偏移（实现“变高”效果）},label: {// show: false,},},projection: {project: (point) => [(point[0] / 180) * Math.PI,-Math.log(Math.tan((Math.PI / 2 + (point[1] / 180) * Math.PI) / 2)),],unproject: (point) => [(point[0] * 180) / Math.PI, ((2 * 180) / Math.PI) * Math.atan(Math.exp(point[1])) - 90],},},//涟漪波纹点位配置{type: "effectScatter", coordinateSystem: "geo", //使用地理坐标系 geo//要有对应的经纬度才显示，先经度再维度data: [{ name: "西北战区", value: [85.40327,44.120598] },{ name: '西南战区', value: [87.059027,32.823035] },{ name: '华南战区', value: [108.15847,24.541824] },{ name: '华东战区', value: [116.032513,28.837198] },{ name: '上海都市圈战区', value: [119.955595,31.865488] },{ name: '东北战区', value: [128.119537,46.086026] },{ name: '华北战区', value: [108.76558,41.144579] },{ name: '华中战区', value: [111.635559,31.459131] },{ name: '北京首都圈战区', value: [116.400459,39.902134] },],showEffectOn: "render", //绘制完成后显示特效rippleEffect: {scale: 5, // 波纹的最大缩放比例brushType: "stroke", // 波纹的绘制方式 stroke fill},hoverAnimation: true,label: {//图形上的文本标签show: true,formatter: "{b}",position: "right",fontWeight: 500,fontSize: 10,},//默认样式itemStyle: {color: "#CC17FA",shadowBlur: 10,shadowColor: "#333",},//鼠标移入时样式emphasis: {show: false,// 每个区域的颜色// 鼠标滑过颜色areaColor: "#97EFF4",// 鼠标滑过边框颜色shadowColor: "#05EFF7",// XY轴的偏移量shadowOffsetX: 5,shadowOffsetY: 5,},zlevel: 1,select: {itemStyle: {color: "#FFF",},},},],},

2.效果

echarts地图添加涟漪波纹点位

1.完整代码 chartsOption: {tooltip: {trigger: "item",formatter: this.initTooltip,triggerOn: "mousemove",borderColor: "#fff",backgroundColor: "rgba(216, 227, 244, 1)",extraCssText: "border-radius: 14px;", //…...

编程日记 2025/9/20 13:04:24

Linux(十三）fork + exec进程创建

一、进程创建在了解进程创建的步骤前，让我们先通过实例观察一下。大家可以跟小编一起，在终端中执行3次ps -f命令，观察一下。通过上图，我们可以发现，3次ps -f的父进程（PPID）都是一样的&#xf…...

编程日记 2025/9/12 7:21:51

集合计算高级函数

说明过滤遍历一个集合并从中获取满足指定条件的元素组成一个新的集合转化/映射（map）将集合中的每一个元素映射到某一个函数扁平化扁平化映射注：flatMap 相当于先进行 map 操作，在进行 flatten 操作集合中的每个元素的子元素映…...

编程日记 2025/9/17 14:22:27

鼎讯信通便携式雷达信号干扰模拟器：打造实战化电磁环境的新利器

在现代战争中，电磁环境的复杂性直接影响着雷达装备的性能和作战效果。面对敌方日益精进的电子战手段，如何提升雷达设备的抗干扰能力，确保其在实战环境中的稳定性和可靠性，已成为各国军队和科研机构的重要课题。为此，…...

编程日记 2025/9/21 7:46:21

避开养生误区，拥抱健康生活

在追求健康的道路上，我们常常会陷入一些养生误区，不仅无法达到预期效果，还可能损害身体健康。只有拨云见日，认清这些误区，采取正确的养生方式，才能真正拥抱健康生活。很多人认为，保健品吃得…...

编程日记 2025/9/19 8:43:18

解码ChatBI技术形态：独立对话框、插件式与IM集成模式的技术优劣

ChatBI的形态之争随着大语言模型（LLM）技术的成熟，**对话式商业智能（ChatBI）**正成为企业数据分析的新范式。然而，不同的技术形态直接影响ChatBI的落地效果——独立对话框、插件式助手、IM集成机器人&…...

编程日记 2025/9/19 9:45:59

rockylinux 8 9 升级到指定版本

rockylinux 8 update 指定版本 rockylinux 历史版所有版本rockylinux 最新版所有版本vault历史版 pub最新版(https://dl.rockylinux.org)地址后面增加不同名称 echo "delete repos" rm -rf /etc/yum.repos.d/*echo "new rockylinux repo" cat <<EO…...

编程日记 2025/9/18 11:02:49

一文详解OpenCV环境搭建：Ubuntu20.4使用CLion配置OpenCV开发环境

在计算机视觉和图像处理领域，OpenCV 是一个不可或缺的工具。其为开发者提供了一系列广泛的算法和实用工具，支持多种编程语言，并且可以在多个平台上运行。对于希望在其项目中集成先进视觉功能的开发者来说，掌握如何配置和使用OpenC…...

编程日记 2025/9/16 4:29:28

Android Coli 3 ImageView load two suit Bitmap thumb and formal，Kotlin（四）

Android Coli 3 ImageView load two suit Bitmap thumb and formal，Kotlin（四） 对 Android Coli 3 ImageView load two suit Bitmap thumb and formal，Kotlin（三）-CSDN博客进行完善，注意完善 …...

编程日记 2025/9/20 5:12:05

01-JVM 内存模型与 GC 原理

JVM 内存模型与 GC 原理解析本文将从 JVM 内存模型入手，深入剖析各个区域的作用、GC 的运行机制与常见算法，并结合源码与面试思维，带你掌握 JVM 的底层世界。一、JVM 内存模型（Java Memory Model） JVM 将内存划分为…...

编程日记 2025/9/18 18:19:25

Docker--Docker镜像制作的注意事项

Docker 镜像制作 dockerfiles的指令讲解链接 CMD和ENTRYPOINT CMD 和 ENTRYPOINT 是 Dockerfile 中用于指定容器启动时运行命令的两个指令。它们在功能上有一些相似之处，但也存在重要区别。在编辑Dockerfile时，ENTRYPOINT或者CMD命令会自动覆盖之前…...

编程日记 2025/9/19 17:29:13

AI：支持向量机（SVM）

支持向量机（SVM）理论基础详解：从零开始的完全指南一、SVM的核心思想：直观理解 1.1 什么是分类问题？想象你在玩一个游戏：桌上有红色和蓝色的球，你需要画一条线把它们分开。这条线就是分类边界。SVM的目标是找到一条最优分界线，使得这条线到最近的红色球和蓝色球的距…...

编程日记 2025/9/11 1:16:31

Vue.js 中 v-if 的使用及其原理

在 Vue.js 的开发过程中，条件渲染是一项极为常见的需求。v-if指令作为 Vue.js 实现条件渲染的关键手段，能够根据表达式的真假来决定是否渲染某一块 DOM 元素。它在优化页面展示逻辑、提升用户体验等方面发挥着重要作用。接下来，我们就深入探讨…...

编程日记 2025/9/19 19:02:16

Vue.js 中 v-show 的使用及其原理

在 Vue.js 的开发过程中，我们常常需要根据不同的条件来控制页面元素的显示与隐藏。v-show指令作为 Vue.js 提供的重要工具之一，为我们实现这一功能提供了便捷的途径。它与v-if指令有些相似，但在使用方法和原理上存在着明显的区别。接下来&…...

编程日记 2025/9/4 22:41:25

docker安装redisSearch

1.背景 Redis Search 是 Redis 官方提供的全文搜索引擎,它为Redis 提供全文搜索、索引和复杂查询功能。它基于内存存储，结合了 Redis 的高性能和倒排索引技术，支持实时搜索、聚合分析、模糊匹配等场景。RedisSearch 适用于需要快速检索结构化或非结构化…...

编程日记 2025/9/20 5:12:23

ADI的BF561双核DSP怎么做开发，我来说一说（六）IDE硬盘设计

作者的话 ADI的双核DSP，最早的一颗是Blackfin系列的BF561，这颗DSP我用了很久，比较熟悉，且写过一些给新手的教程。是的你没有看错，就是IDE，那个最老的硬盘，我们当年做过此类设计。硬件准备 …...

编程日记 2025/9/10 1:29:15

5.数据结构-图

5.数据结构-图 5.1 图的定义和基本术语5.1.1 图的定义5.1.2 图的基本术语 5.2图的存储结构5.2.1邻接矩阵采用邻接矩阵表示法创建无向网邻接表 5.1 图的定义和基本术语 5.1.1 图的定义图 G由两个集合V和E组成，记为 G ( V , E ) G(V,E) G(V,E)，其中V是…...

编程日记 2025/9/9 17:52:35

uni-app使用web-view传参的坑

问题描述 uni-app开发的一个页面，需要点击时跳转到PC端后台的一个详情页，所以需要传参如下： ticketIdticketCodetoken（用于自动登录，校验身份的） 但是吧，如果你明文传token，容易导…...

编程日记 2025/9/11 11:16:17

Android studio打包uniapp插件

一.参考资料与环境准备原生工程配置需要使用到Android studio和HbuilderX 当前测试的as版本-20240301,下载地址：HbuilderX版本：4.36 二.插件创建流程 1.导入下载的UniPlugin-Hello-AS工程（下载地址见参考资料） 2.生成jks证书…...

编程日记 2025/9/19 17:19:23

SVT-AV1学习-函数selfguided_restoration_fast_internal

一 selfguided_restoration_fast_internal 函数作用 selfguided_restoration_fast_internal是SVT-AV1 编码器中用于自引导恢复Guided Resration SGR 的一个内部函数，通过自引导滤波技术对输入的去燥他图像数据进行处理，生成一个去燥版本的图像&#xff0…...

编程日记 2025/9/16 6:00:14

双引擎驱动：解密音视频体验的QoS技术底座与QoE感官革命

QoS 定义：QoS（Quality of Service，服务质量）衡量音视频传输技术层面的性能表现，聚焦网络传输和系统处理能力，通过客观指标量化服务质量。核心指标码率/带宽：数据传输速率上限，直接…...

编程日记 2025/9/6 4:48:19

element-plus选择菜单栏不变色

代码： <template> ... <el-menu-item index"/task/execute"><el-icon><IconMenu /></el-icon><span>验收任务</span> </el-menu-item> <el-menu-item index"/task/change"><el-icon…...

编程日记 2025/9/21 4:32:36

uniapp加载json动画

一、添加canvas画布 <canvas id"lottie_demo" type"2d" style"display: inline-block;width: 148rpx; height: 148rpx;" /> 二、引入依赖和JSON文件安装依赖 npm install lottie-miniprogram --save import lottie from lottie-mini…...

编程日记 2025/9/19 5:40:30

快递物流展同期举办2025中国智慧物流核心零部件创新论坛

2025中国智慧物流核心零部件创新论坛会议主题：“AI ”重构智慧物流核心技术生态会议介绍随着人工智能、物联网、5G等技术的快速发展，智慧物流已成为全球物流行业转型升级的核心方向。在AI技术的驱动下，物流行业正从传统的“人、车、货”…...

编程日记 2025/9/12 14:32:03

ASP.NET图书馆借阅系统(源码+lw+部署文档+讲解)，源码可白嫖!

摘要近些年来，随着科技的飞速发展，互联网的普及逐渐延伸到各行各业中，给人们生活带来了十分的便利，图书馆借阅系统利用计算机网络实现信息化管理，使图书信息、图书借阅、归还的管理发展和服务水平有显著提升。本文拟…...

编程日记 2025/9/8 1:08:56

在 Linux 终端中轻松设置 Chromium 的 User-Agent：模拟手机模式与自定义浏览体验

在 Linux 系统中，通过终端灵活控制 Chromium 的行为可以大幅提升工作效率。本文将详细介绍如何通过命令行参数和环境变量自定义 Chromium 的 User-Agent，并结合手机模式模拟，实现更灵活的浏览体验。为什么需要自定义 User-Agent？…...

编程日记 2025/9/15 5:51:27

实验一单管共射极放大电路

这篇文章是即兴写的，也不知道对不对，只有代码哦~~(文章结尾有彩蛋哦~~~） 表1-1实验数据MATLAB代码： clear all; clc % 参数设置 VCC 12; % 电源电压 (V) RB1 45e3; % 偏置电阻 RB1 (Ohms) RB2 15e3; % 偏置电阻 RB2 (Ohms) R…...

编程日记 2025/9/12 6:03:27

10-python面向对象(上)

10-python面向对象【上】 1.面向对象简介2. 类(class)3. 类的定义4. 参数self4.1 属性和方法4.2 self 1.面向对象简介 Python是一门面向对象的编程语言所谓面向对象的语言，简单理解就是语言中的所有操作都是通过对象来进行的面向过程： 面向过程指将我们…...

编程日记 2025/9/11 10:21:49

Java 大视界 -- 基于 Java 的大数据分布式缓存技术在电商高并发场景下的性能优化（181）

💖亲爱的朋友们，热烈欢迎来到青云交的博客！能与诸位在此相逢，我倍感荣幸。在这飞速更迭的时代，我们都渴望一方心灵净土，而我的博客正是这样温暖的所在。这里为你呈上趣味与实用兼具的知识，也…...

编程日记 2025/9/9 7:49:13

Apache Airflow开源程序是一个以编程方式编写、计划和监控工作流程的平台

一、软件介绍文末提供程序和源码下载 Apache Airflow开源程序是一个以编程方式编写、计划和监控工作流程的平台，当工作流被定义为代码时，它们将变得更加可维护、可版本化、可测试和协作性。使用 Airflow 将工作流创作为任务的有向无环图 （D…...

编程日记 2025/9/8 12:07:05

大数据学习（101）-spark的高可用模式

🍋🍋大数据学习🍋🍋 🔥系列专栏： 👑哲学语录: 用力所能及，改变世界。 💖如果觉得博主的文章还不错的话，请点赞👍收藏⭐️留言📝支持一…...

编程日记 2025/9/10 3:45:53

数字内容体验驱动用户参与增效

数字体验驱动参与增长在数字化竞争日益激烈的市场环境中，数字内容体验已成为撬动用户深度参与的核心杠杆。通过个性化推荐算法与跨渠道分发策略的协同作用，企业能够精准匹配用户兴趣点，将碎片化信息转化为连贯的价值链条。数据显示&#xf…...

编程日记 2025/9/9 15:01:43

一文详解OpenGL环境搭建：Ubuntu20.4使用CLion配置OpenGL开发环境

在计算机图形学的广阔领域中，OpenGL作为行业标准的图形库，为开发者提供了强大的工具集来创建从简单的2D图形到复杂的3D世界。然而，对于初学者而言，配置一个合适的开发环境是迈向成功的第一步。本文将详细介绍如何在Ubuntu 20.04.3 LTS操作系统上搭建基于CLion的OpenGL开发环…...

编程日记 2025/9/10 10:35:16

欧拉函数模板

1.欧拉函数模板 - 蓝桥云课问题描述这是一道模板题。首先给出欧拉函数的定义：即 Φ(n) 表示的是小于等于 n 的数中和 n 互质的数的个数。比如说 Φ(6)2，当 n 是质数的时候，显然有 Φ(n)n−1。题目大意： 给定 n 个正整数…...

编程日记 2025/9/3 14:11:16

用PointNet++训练自己的数据集（语义分割模型semseg）

（1）训练部件分割（partseg）模型和检测自己点云并将结果保存txt，请看博主上两篇文章 （2）本文背景是将pipe点云上的缺陷和本体检测出来，即1种语义场景（pipe）&…...

编程日记 2025/9/14 17:35:42

Java反射机制深度解析：方法、实战与底层机制

大家好，我是钢板兽！ 反射作为Java的特性，它不仅是Spring三大特性Ioc、DI、AOP的基础，而且MyBatis、Jackson序列化、rpc远程调用接口都用到了反射机制。本文将带你系统性地掌握 Java 反射的使用，通过 JSON 反序列化的…...

编程日记 2025/9/3 7:29:30

查看wifi密码

netsh wlan show profile nameCMCC-Rkt_Wi-Fi5 keyclear CMCC-Rkt_Wi-Fi5是无线网名称...

编程日记 2025/9/16 3:42:39

RPC 发展史

RPC 发展史 RPC（Remote Procedure Call）即远程过程调用，随着微服务的兴起，每个服务都拥有自己的数据库，负责各自的模块，例如 keystone（认证服务）负责用户信息、权限认证的内容&…...

编程日记 2025/9/15 1:39:57

蓝桥杯基础算法-递归

代码简洁，但涉及到的运算，会随着递归层数的增加成指数级增长路分析：第20行20列位于45度这条线上这条线上的数字是1 5 13 25 41...两数之差:4 8 12 16 --->每一个都是在前面的基础上4，可以用递归或者循环 public class dem…...

编程日记 2025/9/3 3:55:55

山东大学离散数学第七章习题解析

参考教材：离散数学教程，徐秋亮 / 栾俊峰 / 卢雷 / 王慧 / 赵合计编著，山东大学计算机科学与技术学院注：该解析为个人所写，涵盖了 2022-2023-2 学期赵合计老师所布置的所有课本习题；由于学识、认识及经验…...

编程日记 2025/9/9 5:14:56

关于使用python 安装 flask-openapi3扩展，使用docker 环境的完整复盘

在某个时刻需要运行python 3 flask-openapi3扩展当前因为服务器为国产化服务器，操作系统版本为麒麟，python 版本为3.7 因为要安装flask-openapi3 包又因为flask 版本小于2.0 from flask_openapi3 import OpenAPI,Info,Tag目前安装的是 …...

编程日记 2025/9/8 16:55:20

MybatisPlus的一些基本操作

mybatisplus分页 Testvoid testpage(){IPage<User> page new Page<>(1,3); userDao.selectPage(page,null);System.out.println("当前页码值："page.getCurrent());System.out.println("每页显示数："page.getSize());S…...

编程日记 2025/9/4 16:55:04

debian12安装mysql5.7.42（deb）

安装官方文档 https://dev.mysql.com/doc/mysql-installation-excerpt/8.0/en/linux-installation-debian.html 上面是8.0的教程，服了我说怎么那么奇怪 5.7官方教程 https://dev.mysql.com/doc/mysql-installation-excerpt/5.7/en/linux-installation-debian.html …...

编程日记 2025/9/18 14:28:23

基于Python脚本实现Flink on YARN任务批量触发Savepoint的实践指南

基于Python脚本实现Flink on YARN任务批量触发Savepoint的实践指南一、背景与价值在流计算生产环境中，Flink on YARN的部署方式凭借其资源管理优势被广泛采用。Savepoint作为Flink任务状态的一致性快照，承载着故障恢复、版本升级、作业暂停等重要场景…...

编程日记 2025/9/9 0:47:09

Winform入门进阶企业级开发示例：http接口数据清洗转换、断线续传、mqtt数据传输实例详解(附代码资源下载)

场景 C#/Winform入门、进阶、强化、扩展、知识体系完善等知识点学习、性能优化、源码分析专栏分享: C#/Winform入门、进阶、强化、扩展、知识体系完善等知识点学习、性能优化、源码分析专栏分享_winform 强化学习-CSDN博客如何将以上相关理论知识学以致用。下面针对Winform…...

编程日记 2025/9/9 1:34:15

PHP开发效率提升利器：通义灵码在VSCode中的应用与技巧

引言在 PHP 开发领域，提高编码效率和质量是每位开发者追求的目标。通义灵码，作为一款由阿里云技术团队开发的智能编码助手，能够通过其强大的 AI 能力，为 PHP 开发者提供包括代码自动补全、智能注释、代码优化等多方面的支持。本…...

编程日记 2025/9/18 18:54:42

WHAT - React 错误边界处理 - react-error-boundary

目录安装使用方式常用 Props使用场景 react-error-boundary 是一个由 Brian Vaughn 开发的 React 组件库，用于更方便地处理组件树中的错误（错误边界）。阅读参考： React Error Boundariesreact-error-boundary 安装 npm inst…...

编程日记 2025/9/13 14:51:10

数据模型评估的四维黄金法则：从技术验证到业务价值证明

引言：为什么你的数据模型总被质疑？ 在滴滴出行的一次核心业务会议上，数据团队与业务部门爆发了激烈争论：新上线的订单预测模型是否真的优于旧系统？数据工程师认为查询速度提升40%已是巨大成功，业务方却质疑…...

编程日记 2025/8/26 7:56:51

vscode ctrl+鼠标左键不能跳转

笔者使用的vscode版本是1.85.2（一周前从1.99降下来的，因为版本过高连不上服务器）。使用python时突然发现代码看起来有些别扭，细看之下发现是import xxx语句中的包的颜色从之前的青色变成了现在的白色。再用ctrl左键点击包名试图…...

编程日记 2025/9/16 8:08:25

换动态IP对电脑有什么影响：全面解析与实用指南

在当今数字化时代，IP地址作为网络世界的"身份证"，对我们的网络体验有着重要影响。许多用户出于某些原因，会考虑更换动态IP地址。那么，这种操作究竟会对我们的电脑产生哪些影响？是利大于弊还是弊大于利&#…...

编程日记 2025/8/30 5:23:15

相关文章：