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

「数据可视化 D3系列」入门第十二章：树状图详解与实践

news 来源：原创 2025/7/21 6:27:33

树状图深度解析与实现

一、核心API解析
- - 1. d3.hierarchy
  - 2. d3.tree
  - 3. 节点操作方法
二、完整实现解析
三、高级技巧与优化
四、常见问题解决
小结
下章预告：地图可视化

树状图是一种常见的层次结构可视化方式，它能够清晰地展示数据之间的父子关系。本文将详细介绍如何使用D3.js创建树状图，并解析相关核心API的使用方法。

一、核心API解析

1. d3.hierarchy

d3.hierarchy 是构建树状图的基础，它从给定的层次结构数据构造一个根节点，并为各个节点指定深度等属性：

var hierarchyData = d3.hierarchy(data).sum(function (d,i) {return d.value;});

调用后，每个节点会被附加以下属性：

node.data - 关联的原始数据
node.depth - 当前节点的深度，根节点为0
node.height - 当前节点的高度，叶节点为0
node.parent - 当前节点的父节点
node.children - 当前节点的子节点
node.value - 当前节点及后代节点的总计值

2. d3.tree

d3.tree 创建一个新的整齐(同深度节点对齐)的树布局生成器：

var tree = d3.tree().size([width, height]).separation(function(a,b) {return (a.parent==b.parent?1:2)/a.depth;});

关键配置方法：

tree.size([width, height]) - 设置布局尺寸
tree.separation() - 设置相邻节点间距函数

3. 节点操作方法

node.descendants() - 返回从当前节点开始的所有后代节点数组
node.links() - 返回当前节点所在子树的所有边(连接线)

二、完整实现解析

👇 代码示例

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>D3.js 树状图实现</title><script src="https://d3js.org/d3.v7.min.js"></script><style>.node circle {fill: #4a8bc9;stroke: #2c6cb0;stroke-width: 2px;}.node text {font: 12px sans-serif;fill: #333;}.link {fill: none;stroke: #ccc;stroke-width: 1.5px;}.node:hover circle {fill: #ff7f0e;}.node:hover text {font-weight: bold;}</style>
</head>
<body><svg width="1000" height="600"></svg><script>// 层次结构数据const data = {name: "中国",children: [{name: "浙江",children: [{name: "杭州", value: 100},{name: "宁波", value: 100},{name: "温州", value: 100},{name: "绍兴", value: 100}]},{name: "广西",children: [{name: "桂林",children: [{name: "秀峰区", value: 100},{name: "叠彩区", value: 100},{name: "象山区", value: 100},{name: "七星区", value: 100}]},{name: "南宁", value: 100},{name: "柳州", value: 100},{name: "防城港", value: 100}]},{name: "黑龙江",children: [{name: "哈尔滨", value: 100},{name: "齐齐哈尔", value: 100},{name: "牡丹江", value: 100},{name: "大庆", value: 100}]},{name: "新疆",children: [{name: "乌鲁木齐", value: 100},{name: "克拉玛依", value: 100},{name: "吐鲁番", value: 100},{name: "哈密", value: 100}]}]};// 设置SVG和边距const margin = {top: 60, right: 120, bottom: 60, left: 60};const width = 1000 - margin.left - margin.right;const height = 600 - margin.top - margin.bottom;// 创建SVG容器const svg = d3.select("svg").attr("width", width + margin.left + margin.right).attr("height", height + margin.top + margin.bottom).append("g").attr("transform", `translate(${margin.left},${margin.top})`);// 创建层级布局const root = d3.hierarchy(data);root.sum(d => d.value || 0); // 计算每个节点的值// 创建树布局const treeLayout = d3.tree().size([height, width - 200]) // 交换宽高以创建水平树.separation((a, b) => (a.parent === b.parent ? 1 : 1.5) / a.depth);// 应用布局到数据treeLayout(root);// 创建连接线生成器const linkGenerator = d3.linkHorizontal().x(d => d.y).y(d => d.x);// 绘制连接线svg.append("g").selectAll(".link").data(root.links()).join("path").attr("class", "link").attr("d", linkGenerator);// 创建节点组const node = svg.append("g").selectAll(".node").data(root.descendants()).join("g").attr("class", "node").attr("transform", d => `translate(${d.y},${d.x})`);// 添加圆形节点node.append("circle").attr("r", 8).on("mouseover", function() {d3.select(this).attr("r", 10);}).on("mouseout", function() {d3.select(this).attr("r", 8);});// 添加文本标签node.append("text").attr("dy", "0.31em").attr("x", d => d.children ? -15 : 15).attr("text-anchor", d => d.children ? "end" : "start").text(d => d.data.name).clone(true).lower().attr("stroke", "white").attr("stroke-width", 3); // 添加白色描边使文字更清晰// 添加简单的缩放功能svg.call(d3.zoom().scaleExtent([0.5, 2]).on("zoom", (event) => {svg.attr("transform", event.transform);}));</script>
</body>
</html>

👇 实现效果

在这里插入图片描述

三、高级技巧与优化

1. 交互功能： 可以添加鼠标悬停效果，如高亮节点、显示详细信息等

2. 动画过渡： 使用D3的过渡效果让树状图的展开/收起更加平滑

3. 径向布局： 修改链接生成器可以创建放射状的树状图

4. 缩放和平移： 对于大型树状图，可以添加缩放和平移功能

四、常见问题解决

1. 节点重叠： 调整separation函数或使用不同的布局算法

2. 文本溢出： 根据文本长度动态调整位置或添加省略号

3. 性能优化： 对于大型数据集，考虑使用虚拟DOM或简化渲染

小结

1. 核心概念理解

树状图是展示层次结构数据的有效方式
D3的树布局算法会自动计算节点的位置
数据需要通过 d3.hierarchy() 转换为适合可视化的格式

2. 关键步骤

数据准备： 构建层次结构数据
创建层级： 使用 d3.hierarchy()
布局计算： 使用 d3.tree() 定义布局
绘制元素： 分别绘制连接线和节点
添加交互： 如缩放、悬停效果

3. 优化技巧

使用CSS样式分离视觉表现
添加交互效果增强用户体验
文本描边提高可读性
实现缩放功能处理大型树

4. 扩展方向

添加节点展开/折叠功能
实现动态数据更新
创建径向树状图
添加工具提示显示详细信息

5. 实际应用场景

组织结构图
文件目录结构
家谱图
决策树可视化
产品分类

下章预告：地图可视化

「数据可视化 D3系列」入门第十二章：树状图详解与实践

树状图深度解析与实现一、核心API解析1. d3.hierarchy2. d3.tree3. 节点操作方法二、完整实现解析三、高级技巧与优化四、常见问题解决小结下章预告：地图可视化树状图是一种常见的层次结构可视化方式，它能够清晰地展示数据之间的父子关系。本文将详细…...

编程日记 2025/7/21 6:27:33

IDEA 创建Maven 工程（图文）

设置Maven 仓库打开IDEA 开发工具，我的版本是2024.3.1（每个版本的位置不一样）。在【Customize】选项中，可以直接设置【语言】，在最下面选择【All setting】。进入到熟悉的配置界面，选择配置的【setting…...

编程日记 2025/6/29 9:40:29

机器学习06-RNN

RNN（循环神经网络）学习笔记一、RNN 概述循环神经网络（Recurrent Neural Network，RNN）是一类以序列数据为输入，在序列的演进方向进行递归且所有节点（循环单元）按链式连接的递归神…...

编程日记 2025/6/29 11:38:00

Java常用正则表达式及使用方法

在 Java 中，Pattern 和 Matcher 类是 java.util.regex 包的核心，用于处理正则表达式。 Pattern 类 Pattern 类表示编译后的正则表达式，它提供了一种将正则表达式字符串编译成可执行对象的方式，以便后续用于匹配操作。常用方法…...

编程日记 2025/6/29 11:20:58

新零售行业时代：如何用科技驱动传统零售的转型升级

新零售行业时代：如何用科技驱动传统零售的转型升级 “在变化的世界中，唯一不变的是变化本身。” 一、传统零售的困局：当“生存”成为一场鏖战街角的便利店老板老王，每天凌晨4点起床进货，却在月…...

编程日记 2025/6/29 9:39:09

DeepSeek和Excel结合生成动态图表

文章目录一、前言二、3D柱状图案例2.1、pyecharts可视化官网2.2、Bar3d-Bar3d_puch_card2.3、Deepseek2.4、WPS2.5、动态调整数据一、前言最近在找一些比较炫酷的动态图表，用于日常汇报，于是找到了 DeepseekExcel王牌组合，其等同于动态图…...

编程日记 2025/7/21 6:24:19

大模型学习笔记------Llama 3模型架构之分组查询注意力（GQA）

大模型学习笔记------Llama 3模型架构之分组查询注意力（GQA） 1、分组查询注意力（GQA）的动机2、多头注意力（Multi-Head Attention, MHA）3、多查询注意力 (Multi-Query Attention，MQA)4、分组查…...

编程日记 2025/6/29 11:54:52

WordPress 只能访问html文件，不能访问php

部署WordPress 遇到的问题说来惭愧，尝试了多次流程，输入ip能够访问到配置路径下面的html文件，但就是无法访问php文件，查来查去，最后在AI工具的逐一梳理下，是PHP-FPM配置下面出的问题，默认账号…...

编程日记 2025/7/21 6:27:32

Python 之 pyecharts 使用

要说绘制动态图表，echarts 肯定是有一席之地的，特别是像 flask 这种轻量级的 web 框架，在 html 中动态嵌入生成 echarts 无疑是很优的选择。pyecharts 简单来说就是以 python 的方式来生成对应的 echarts 图表。安装 pip install pyechart…...

编程日记 2025/7/18 11:47:12

【第九章 Python学习之函数Ⅱ】

【2025】Python最新最完整教程，零基础看这一个就够了第九章 Python学习之函数Ⅱ 文章目录【2025】Python最新最完整教程，零基础看这一个就够了前言一、说两句二、定义函数函数定义规则函数的参数参数的类型及用途1. 必需参数（位置参数）2. 关键字参数3. 默认参数4. 可变参…...

编程日记 2025/6/29 11:15:35

传入的表格格式数据流(TDS)远程过程调用(RPC)协议流不正确。此 RPC 请求中提供了过多的参数。最多应为 2100。

### Error updating database. Cause: com.microsoft.sqlserver.jdbc.SQLServerException: 传入的表格格式数据流(TDS)远程过程调用(RPC)协议流不正确。此 RPC 请求中提供了过多的参数。最多应为 2100。这是因为集合数据量过大，需要对集合进行拆分操作&#xff0…...

编程日记 2025/6/29 12:06:24

IDEA热加载

翻译:"你运行的应用程序 BfApplication 启动之后，它的一些类文件（通常是你修改过的 .java 文件被重新编译了）发生了变化。你想现在就重新加载这些更改过的类吗？" 解释: 热重载: 这是一种开发时非常有用的技术。当你…...

编程日记 2025/6/29 11:11:49

常用第三方库：dio网络库使用与封装

常用第三方库：dio网络库使用与封装前言 dio是Flutter生态中最受欢迎的网络请求库之一，它提供了强大的功能和灵活的配置选项。本文将从实战角度深入介绍dio的使用技巧和最佳实践。基础知识 1. dio简介 dio是一个强大的Dart Http请求库，…...

编程日记 2025/6/29 11:06:16

解决IntelliJ IDEA配置文件（application.properties）中文注释变成乱码的问题

文章目录 1. 问题呈现2. 问题产生的原因3. 解决方法更多 IntelliJ IDEA 的使用技巧可查看 IntelliJ IDEA 专栏中的文章：IntelliJ IDEA 1. 问题呈现在 IntelliJ IDEA 中打开配置文件（application.properties）时，文件中的中文注…...

编程日记 2025/7/9 6:20:24

linux基础14--dns和web+dns

DNS：域名系统（Domain Name System） DNS协议是用来将域名转换为IP地址或将IP地址转换为相应的域名 DNS使用TCP和UDP端口53，给用户提供解析时一般使用UDP53 对于每一级域名长度的限制是63个字符，域名总长度则不能超过2…...

编程日记 2025/6/29 10:57:20

Java 静态内部类面试题与高质量答案合集

本文整理了关于 Java 静态内部类（Static Nested Class）在面试中的高频问题及标准答案，帮助你理解其底层原理、内存表现以及实际应用。 1. 什么是静态内部类？和普通内部类有什么区别？ 答： 静态内部类是定义…...

编程日记 2025/6/29 12:25:08

React.cloneElement的用法详解

React.cloneElement的用法详解 React.cloneElement 是 React 提供的一个 API，用于克隆现有的 React 元素，并在克隆的基础上添加或覆盖属性，同时保留原有的子元素。语法 React.cloneElement(element: ReactElement, props?: Partial<P…...

编程日记 2025/6/29 12:17:03

【数学建模】孤立森林算法：异常检测的高效利器

孤立森林算法：异常检测的高效利器文章目录孤立森林算法：异常检测的高效利器1 引言2 孤立森林算法原理2.1 核心思想2.2 算法流程步骤一：构建孤立树(iTree)步骤二：构建孤立森林(iForest)步骤三：计算异常分数 3 代码实现…...

编程日记 2025/6/29 10:36:19

3.1 WPF使用MaterialDesign的介绍1

MaterialDesignInXAML Toolkit 是一个流行的开源 C# WPF 控件库，它实现了 Google 的 Material Design 规范，让开发者可以轻松创建现代化的 WPF 应用程序界面 Material Design 是一个流行的设计语言，由 Google 开发，旨在帮助开发者构建美观且一致的 UI 界面。对于使用 C# 的…...

编程日记 2025/6/29 11:11:58

多路转接select服务器

目录 select函数原型 select服务器 select的缺点前面介绍过多路转接就是能同时等待多个文件描述符，这篇文章介绍一下多路转接方案中的select的使用 select函数原型 #include <sys/select.h> int select(int nfds, fd_set *readfds, fd_set *writefds, f…...

编程日记 2025/6/29 11:25:41

【算法】BFS-解决FloodFill问题

目录 FloodFill问题图像渲染岛屿数量岛屿的最大面积被围绕的区域 FloodFill问题 FloodFill就是洪水灌溉的意思，假设有下面的一块田地，负数代表是凹地，正数代表是凸地，数字的大小表示凹或者凸的程度。现在下一场大雨&…...

编程日记 2025/6/29 10:45:06

二叉树层序遍历技术解析与面试指南

文章目录一、二叉树层序遍历技术解析1. 问题描述2. 层序遍历核心思想3. Java实现代码（带详细注释）4. 算法关键点解析5. 复杂度分析二、资深后端面试深度指南1. 高频面试问题集Q1: 如何实现Z字形层序遍历（锯齿形遍历）&#xff1f…...

编程日记 2025/6/29 11:46:35

软考软件设计师考试情况与大纲概述

文章目录 **一、考试科目与形式****二、考试大纲与核心知识点****科目1：计算机与软件工程知识****科目2：软件设计** **三、备考建议****四、参考资料** 这是一个系列文章的开篇本文对2025年软考软件设计师考试的大纲及核心内容进行了整理，并…...

编程日记 2025/7/13 2:26:22

一款丰富的工作流自动化平台 | N8N 83.6K ⭐

N8N 介绍 N8N 是一个工作流自动化平台，为技术团队提供代码的灵活性和无代码的速度。n8n 具有 400 集成、原生 AI 功能和公平代码许可证，可让您构建强大的自动化功能，同时保持对数据和部署的完全控制。 🚢 项目地址 Github: https…...

编程日记 2025/6/29 12:06:07

Apache PDFBox

Apache PDFBox 是一个用于处理 PDF 文档的开源 Java 库，由 Apache 软件基金会开发和维护。它提供了丰富的功能，允许开发者在 Java 应用程序中创建、读取、修改和提取 PDF 文件中的信息。以下是关于 PDFBox 的详细介绍： 主要功能创建 PDF 文…...

编程日记 2025/7/14 19:49:50

如何批量为多个 Word 文档添加水印保护

在日常办公中，Word文档添加水印是一项重要的操作，特别是在需要保护文件内容的安全性和版权时。虽然Office自带了添加水印的功能，但当需要一次性给多个Word文档添加水印时，手动操作显得非常繁琐且低效。为了提高效率，可…...

编程日记 2025/6/29 10:25:28

【MySQL】005.MySQL表的约束(上)

文章目录表的约束1. 约束概念2. 空属性2.1 基本语法2.2 使用示例 3. 默认值3.1 基本概念3.2 使用示例 4. 列描述4.1 基本概念4.2 使用示例 5. zerofill5.1 基本功能5.2 使用示例5.3 注意事项 6. 主键6.1 基本概念6.2 使用示例表的约束 1. 约束概念真正约束字段的是数据类型…...

编程日记 2025/6/29 10:07:06

力扣刷题Day 27：环形链表（141）

1.题目描述 2.思路创建一个结点集合，遍历链表，如果遇到已经加进集合的结点就说明链表有环。 3.代码（Python3） class Solution:def hasCycle(self, head: Optional[ListNode]) -> bool:node headnode_set set()while node…...

编程日记 2025/6/29 11:47:16

window上 elasticsearch v9.0 与 jmeter5.6.3版本冲突，造成es 启动失败

[2025-04-22T11:00:22,508][ERROR][o.e.b.Elasticsearch ] [AIRUY] fatal exception while booting Elasticsearchjava.nio.file.NoSuchFileException: D:\Program Files\apache-jmeter-5.6.3\lib\logkit-2.0.jar 解决方案： 降低 es安装版本 ，选择…...

编程日记 2025/7/13 3:26:22

PDF转换Word深度评测 - ComPDFKit Conversion SDK V3.0

ComPDFKit PDF 转换 SDK 在V3.0 中有以下几个新功能: 使用百万级文档训练数据集对 PPYoloE AI 模型进行微调全场景布局分析算法及下一代表格识别算法重构数据结构、转换流程、PDF解析和输出模块混合布局：将流式布局与固定布局相结合，以保持原始布局…...

编程日记 2025/6/29 9:39:12

Laravel 对接阿里云 OSS 说明文档

Laravel 对接阿里云 OSS 说明文档一、简介将 Laravel 应用与阿里云对象存储服务 (OSS) 对接，可以利用 OSS 提供的高可用、高可靠、可扩展的存储能力来管理应用中的文件，例如用户上传的图片、视频、文档等。这有助于减轻应用服务器的存储压力&#x…...

编程日记 2025/7/18 2:27:17

嘻游电玩三端客户端部署实战：PC + Android + iOS 环境全覆盖教程

本篇文章将针对“网狐系列嘻游电玩组件”的三端客户端（PC端、安卓端、iOS端）进行详细部署实操讲解。文章将以实测部署为核心，提供资源结构说明、平台适配调整、打包配置、常见问题修复，并辅以必要的关键配置代码。一、客户端资源…...

编程日记 2025/6/29 9:39:22

mockMvc构建web单元测试学习笔记

web应用本来需要依靠tomcat这个环境运行现在用mockMvc是为了模拟这个web环境，简化测试什么是mock(模拟) 模拟对象---mock object是以可控方式模拟真实对象行为的假对象，通过模拟输入数据，验证程序达到预期结果为什么使用mock对象因为…...

编程日记 2025/6/29 11:47:05

ffmpeg av_buffer_unref的逻辑实现； av_freep 和 av_freep函数的区别

av_buffer_unref 是 FFmpeg 中用于管理引用计数和内存释放的核心函数，其内部实现机制如下： ‌一、核心流程‌ ‌引用计数递减‌ 函数首先对 AVBufferRef 的 buffer->refcount 进行原子递减操作（通过 atomic_fetch_add_explicit 等机制保证…...

编程日记 2025/6/29 9:40:05

Flutter IOS 真机 Widget 错误。Widget 安装后系统中没有

错误信息： SendProcessControlEvent:toPid: encountered an error: Error Domaincom.apple.dt.deviceprocesscontrolservice Code8 "Failed to show Widget com.xxx.xxx.ServerStatus error: Error DomainFBSOpenApplicationServiceErrorDomain Code1 "T…...

编程日记 2025/6/29 11:54:56

Jenkins plugin 的用法和示例

今天介绍一下比较常见的Jenkins plugin 的使用方法 1. 通过AWS s3 upload 插件上传文件到AWS S3 存储桶前提条件： 安装AWS pipeline step插件在Jenkins 中创建credentials，包含access_key_id和secret_key_id创建S3 存储桶脚本： pipeli…...

编程日记 2025/6/29 9:40:26

利用java语言，怎样开发和利用各种开源库和内部/自定义框架，实现“提取-转换-加载”（ETL）流程的自动化

一、ETL 架构设计的核心要素在企业级数据处理场景中，ETL（Extract-Transform-Load）流程自动化是数据仓库、数据湖建设的核心环节。基于 Java 生态的技术栈，我们可以构建分层解耦的 ETL 架构，主要包含以下四层结构&am…...

编程日记 2025/7/18 9:30:11

人工智能在PET-CT中的应用方向探析

人工智能（AI）在正电子发射断层扫描-计算机断层扫描（PET-CT）中的应用正逐步改变医学影像诊断的格局，其核心价值体现在提升诊断效率、优化成像质量、促进精准医疗等方面。近年来，随着深度学习、计算机视觉以及多模态数据融合技术的迅猛发展，AI技术在PET-CT全流程中的渗透愈…...

编程日记 2025/6/29 12:27:12

pod 创建私有库指南

步骤参考：iOS Pod 私有库创建指南-百度开发者中心下面主要是对参考链接里面的解释： 创建两个仓库： 一个叫podframe.git，用来存放自定义的framework，比如TestPodFrame.framework一个叫podspec.git，用来…...

编程日记 2025/6/29 9:39:25

操作系统之shell实现（下）

🌟 各位看官好，我是maomi_9526！ 🌍 种一棵树最好是十年前，其次是现在！ 🚀 今天来学习C语言的相关知识。 👍 如果觉得这篇文章有帮助，欢迎您一键三连，分享给更…...

编程日记 2025/6/29 9:41:09

【设计模式】深入解析代理模式（委托模式）：代理模式思想、静态模式和动态模式定义与区别、静态代理模式代码实现

代理模式代理模式，也叫委托模式。 Spring AOP 是基于动态代理来实现 AOP 的定义为其他对象提供一种代理以控制对这个对象的访问。它的作用就是通过提供一个代理类，让我们在调用目标方法的时候，不再是直接对目标方法进行调用，而…...

编程日记 2025/6/29 9:39:14

Element Plus表格组件深度解析：构建高性能企业级数据视图

一、架构设计与核心能力 Element Plus的表格组件（el-table）基于Vue 3的响应式系统构建，通过声明式配置实现复杂数据渲染。其核心设计理念体现在三个层级： 数据驱动：通过data属性绑定数据源，支持动态更新与…...

编程日记 2025/6/29 9:39:17

Mongodb分布式文件存储数据库

文章目录一、MongoDB 简介基本信息特点内部组件二、MongoDB 部署1. 安装依赖2. 解压部署并配置环境变量3. 修改配置文件以及启动服务4.数据库权限管理三、MongoDB 管理1. 角色权限2. 操作命令用户管理命令常用命令（Mongo4.2.8）数据库相关用户相关集合…...

编程日记 2025/6/29 12:13:09

UML 通信图对象协作：共享汽车系统交互脉络

目录一、通信图的定义与特点二、通信图的构成要素三、通信图的优势四、通信图的实践应用五、以共享汽车系统通信图为例 （一）参与者及交互起点 （二）预订环节交互 （三）支付流程交互 &#xff0…...

编程日记 2025/7/15 17:08:10

安宝特分享｜AR智能装备赋能企业效率跃升

AR装备开启智能培训新时代在智能制造与数字化转型浪潮下，传统培训体系正面临深度重构。安宝特基于工业级AR智能终端打造的培训系统，可助力企业构建智慧培训新生态。 AR技术在不同领域的助力 01远程指导方面相较于传统视频教学的单向输出模式&#x…...

编程日记 2025/6/29 12:20:45

中间系统-基础

OSI七层模型，TCP/IP四层模型。在OSI模型中我们将具有报文转发的网络节点叫做IS，即中间系统的意思，类似于TCP/IP模型中的路由器。在OSI模型中我们将没有路由能力或者转发能力的设备叫做ES，即端系统的意思，类似于TCP/I…...

编程日记 2025/7/14 22:31:03

【Linux】用户权限

shell命令 1. Linux本质上是一个操作系统，但是一般的用户不能直接使用它，而是需要通过外壳程序shell，来与Linux内核进行沟通。 2. shell的简单定义：命令行解释器。主要包含以下作用： 将使用者的命令翻译给核心处理。将…...

编程日记 2025/7/19 0:09:55

晶振详解：原理、作用、种类、应用与选型要点

一、晶振的基本定义晶振（Crystal Oscillator） 是利用石英晶体的压电效应产生稳定频率的电子元件，其核心功能是为数字系统提供高精度时钟信号。核心公式： 串联谐振频率（fs） 1 / (2π√(L1C1)) &#xff…...

编程日记 2025/6/29 11:05:30

【数字图像处理】立体视觉基础（2）

相机标定【1】相机标定的概念相机参数：相机成像的几何模型的参数相机标定：求解参数的过程【2】相机标定的作用 （1）求出相机的内、外参数，以及畸变参数 （2）校正镜头畸变影响，…...

编程日记 2025/7/20 11:24:55

智能座舱测试内容与步骤

智能座舱的测试步骤通常包括以下环节： 1.测试环境搭建与准备 • 硬件需求分析：准备测试车辆、服务器与工作站、网络设备以及传感器和执行器模拟器等硬件设备。 • 软件需求分析：选择测试管理软件、自动化测试工具、模拟软件和开发调试工具等。…...

编程日记 2025/6/29 9:39:21