S-100 SVG转换工具

S-100 SVG转换工具 S100 SVG转换工具1. 概述本文档详细描述S100 SVG颜色转换工具的技术实现,包括数据结构、算法、处理流程和关键代码逻辑。2. S100 SVG格式规范2.1 CSS类名颜色引用机制S100 SVG符号采用间接颜色引用机制,通过CSS类名而非直接颜色值来定义颜色:元素 - CSS类名 - CSS定义 - 颜色值2.1.1 类名前缀规则前缀含义CSS属性示例sStroke (描边)strokesCHMGD→ stroke颜色fFill (填充)fillfCHMGD→ fill颜色2.1.2 特殊类名类名含义CSS定义f0无填充/透明fill: nonelayout隐藏元素display: none2.2 CSS颜色定义格式/* 描边颜色定义 */.sCHMGD{stroke:#C045D1}/* 填充颜色定义 */.fCHMGD{fill:#C045D1}/* 组合定义 */.sNODTA{stroke:#93AEBB}2.3 S100 SVG示例?xml version="1.0" encoding="UTF-8"??xml-stylesheet type="text/css"?svgxmlns="http://www.w3.org/2000/svg"width="100"height="100"pathclass="sCHMGD fCHMGD"d="M10,10 L90,90"/circleclass="sCHBLK f0"cx="50"cy="50"r="20"//svg3. 数据结构3.1 颜色映射字典# CSS解析后的颜色映射colors={'sCHMGD':'#C045D1',# 描边颜色'fCHMGD':'#C045D1',# 填充颜色'sCHBLK':'#000000',# 黑色描边'fCHBLK':'#000000',# 黑色填充# ... 更多颜色映射}3.2 颜色配置结构# 多配置支持color_profiles={'day':{/*Day颜色映射*/},'dusk':{/*Dusk颜色映射*/},'night':{/*Night颜色映射*/}}3.3 XML颜色配置解析colorProfile.xml结构:colorProfilexmlns="http://www.iho.int/S100ColorProfile/5.1"palettename="Day"itemtoken="CHMGD"srgbred192/redgreen69/greenblue209/blue/srgb/item/palette