在前三部分中我们剖析了地形引擎、调度机制和数据接入。本部分将深入 osgEarth 的矢量可视化子系统揭示其如何将抽象的 GIS 要素点、线、面通过灵活的样式系统Style转化为 GPU 可渲染的三维几何体并实现动态标注、交互与查询。矢量数据是地理信息的灵魂但与规则的影像/高程瓦片不同矢量数据具有不规则性、多样性和动态性三大挑战。osgEarth 的设计哲学是将数据Feature与表现Style分离通过样式化管道Styling Pipeline实现灵活的可视化。一、设计原理要素-样式分离与声明式渲染1.1 核心设计理念要素-样式分离借鉴“模型-视图-控制器”MVC思想。Feature是数据模型包含几何形状和属性字段Style是视图描述定义如何绘制要素FeatureLayer是控制器负责将样式应用到要素上生成几何体。这种分离使得同一份数据如道路可以通过不同样式如高速公路/乡道呈现。声明式样式系统样式通过类 CSS 的声明式语法定义包括选择器哪些要素应用此样式和规则如何绘制。这种方式易于配置、修改和动态切换。样式继承与级联支持类似 CSS 的继承机制父样式可被继承和覆盖实现复杂可视化效果。1.2 矢量渲染架构定位矢量系统是 osgEarth 架构中的高级抽象层位于数据源FeatureSource和场景图FeatureNode之间其核心架构与数据流如下图所示架构核心Feature是纯数据对象Style是纯描述对象GeometryCompiler是两者的粘合剂负责将“数据样式”编译为具体的几何体osg::Geometry。二、总体架构要素、样式、图层的三位一体osgEarth 的矢量系统采用典型的分层架构每一层职责明确通过接口松耦合。2.1 核心类关系图关键类解析类名职责核心成员/方法FeatureSource​数据源抽象从 Shapefile、GeoJSON 等读取要素。getFeatures()返回游标。Feature​要素数据模型包含几何形状Geometry和属性表AttributeTable。StyleSheet​样式表管理器管理多个Style根据要素属性选择匹配样式。Style​样式定义包含一组Symbol如线宽、颜色、图标。Symbol​符号基类定义具体的绘制方式如LineSymbol定义线属性。FeatureLayer​矢量图层组合FeatureSource和StyleSheet生成场景节点。2.2 三层处理架构数据层FeatureSource负责读取原始矢量数据转换为统一的Feature对象。支持 OGR、WFS、GeoJSON 等多种格式。样式层StyleSheet管理样式规则GeometryCompiler将样式编译为渲染指令。渲染层FeatureNode将编译结果几何体、标签、图标挂载到场景图参与 OSG 渲染。三、处理流程从数据到屏幕的完整流水线一个矢量要素从文件到屏幕的渲染需要经历复杂的符号化处理流程其核心阶段如下图所示3.1 详细流程解析阶段一要素读取与解析// 通过 OGR 驱动读取 Shapefile OGRFeatureSource* source new OGRFeatureSource(); source-setURL(roads.shp); source-open(); // 执行空间查询 Query query; query.bounds() mapBounds; FeatureCursor* cursor source-getFeatures(query); while (cursor-hasMore()) { Feature* feature cursor-nextFeature(); // feature 包含几何体和属性 }关键点FeatureSource使用游标FeatureCursor模式支持流式读取避免一次性加载所有数据。阶段二样式匹配与选择样式匹配基于选择器Selector支持属性匹配、空间过滤等多种规则styles !-- 匹配高速公路 -- style namehighway typetext/css [highwaymotorway] { line-color: #ff0000; line-width: 4.0; } !-- 匹配次要道路 -- [highwaysecondary] { line-color: #00ff00; line-width: 2.0; } /style /styles匹配算法获取要素属性读取要素的attributes如highwaymotorway。遍历样式表StyleSheet按优先级遍历所有样式定义。计算匹配度对每个样式计算其选择器与要素属性的匹配度。应用最优样式将匹配度最高的样式应用于该要素。阶段三几何编译与生成这是最复杂的阶段由GeometryCompiler完成其核心任务是将抽象的Symbol转换为具体的osg::Geometry。编译流程// 创建编译器 GeometryCompiler compiler; // 设置编译选项 CompilerOptions options; options.mergeGeometry() true; // 启用几何合并优化 // 编译要素 FeatureList features ...; osg::Node* node compiler.compile(features, style, options);符号处理顺序ExtrusionSymbol处理多边形拉伸建筑体块生成侧面几何体。PolygonSymbol处理多边形填充生成三角网格。LineSymbol处理线型生成带宽度的线条三角带。PointSymbol处理点符号生成图标或公告板。TextSymbol处理文本标注生成文字几何体。性能优化几何合并将相同样式的多个要素合并为单个Geometry减少 DrawCall。实例化渲染对重复的点符号如树木使用实例化大幅提升性能。细节层次基于视距简化几何体远处的道路使用更少顶点。四、样式系统深度解析4.1 符号体系Symbol SystemSymbol是样式的基本单元每种符号对应一种可视化效果符号类型作用关键属性生成几何体PointSymbol​点要素绘制图标路径、大小、旋转osg::Geodeosg::BillboardLineSymbol​线要素绘制颜色、宽度、虚线模式osg::Geometry三角带PolygonSymbol​面要素填充填充色、边框、透明度osg::Geometry三角网格TextSymbol​文字标注字体、大小、偏移osgText::TextExtrusionSymbol​三维拉伸高度、侧面材质osg::Geometry体块AltitudeSymbol​高度模式相对/绝对高度、裁剪影响顶点坐标计算符号叠加一个样式可包含多个符号按定义顺序叠加渲染。例如道路可同时有LineSymbol线和TextSymbol路名。4.2 样式表与选择器样式表StyleSheet支持复杂的规则定义核心语法如下style typetext/css /* 1. 类型选择器匹配所有线要素 */ line { line-color: #ff0000; } /* 2. 属性选择器基于属性值 */ [highwaymotorway] { line-width: 4.0; } /* 3. 类选择器匹配指定类 */ .bridge { altitude-clamping: terrain; } /* 4. 伪类动态状态 */ :hover { line-color: #ffff00; /* 悬停高亮 */ } /* 5. 层级嵌套 */ [typebuilding] { extrusion-height: 20; extrusion-flatten: true; polygon-fill: #cccccc; } /style选择器优先级从高到低:hover,:selected等伪类ID 选择器如#road123属性选择器如[highwaymotorway]类选择器如.bridge类型选择器如line4.3 表达式与数据驱动样式osgEarth 支持表达式语言实现基于属性值的动态样式!-- 根据道路等级动态设置线宽 -- style [highway] { line-width: [case when highwaymotorway then 4.0 when highwayprimary then 3.0 else 2.0 end]; line-color: [match highway motorway #ff0000 primary #00ff00 secondary #0000ff #cccccc /* 默认值 */ end]; } /style表达式引擎内置的表达式解析器支持算术运算、条件判断、字符串处理等类似 SQL 的 CASE 语句。五、接口调用与高级功能5.1 多范式配置示例声明式配置.earth 文件feature_layer nameroads driverogr urlroads.shp/url styles style typetext/css [highway] { line-color: [match highway motorway #ff0000 primary #00ff00 secondary #0000ff #cccccc end]; line-width: 3.0; } /style /styles /feature_layer程序式配置C API// 创建样式 Style style; style.setName(road_style); // 添加线符号 LineSymbol* line style.getOrCreateLineSymbol(); line-stroke()-color() Color::Red; line-stroke()-width() 3.0f; line-stroke()-lineStyle() Stroke::LINE_SOLID; // 添加文本符号 TextSymbol* text style.getOrCreateTextSymbol(); text-content() StringExpression([name]); // 动态文本 text-font() arial.ttf; text-size() 16.0f; text-halo() Color::White; // 创建图层 OGRFeatureSourceOptions sourceOpt; sourceOpt.url() roads.shp; FeatureLayerOptions layerOpt(roads, sourceOpt); layerOpt.styles() new StyleSheet(); layerOpt.styles()-addStyle(style); FeatureLayer* layer new FeatureLayer(layerOpt); map-addLayer(layer);5.2 高级功能三维体块与贴地模式osgEarth 支持多种高级矢量渲染效果建筑体块生成style [building] { /* 基础多边形 */ polygon-fill: #cccccc; /* 拉伸为三维体块 */ extrusion-height: [height]; /* 从属性读取高度 */ extrusion-flatten: true; /* 顶部平整 */ /* 侧面材质 */ extrusion-wall-style: line-color: #666666; line-width: 1.0; } /style贴地与压盖AltitudeSymbol* alt style.getOrCreateAltitudeSymbol(); alt-clamping() AltitudeSymbol::CLAMP_TO_TERRAIN; // 贴地 alt-technique() AltitudeSymbol::TECHNIQUE_GPU; // GPU 贴地 alt-binding() AltitudeSymbol::BINDING_VERTEX; // 顶点绑定性能优化配置feature_layer namebuildings performance max_geometry_memory128/max_geometry_memory !-- 最大几何内存(MB) -- merge_geometrytrue/merge_geometry !-- 启用几何合并 -- instancingtrue/instancing !-- 启用实例化 -- level_of_detail_range0.0 10000.0/level_of_detail_range !-- LOD范围 -- /performance /feature_layer六、总结与第四部分回顾本部分深入剖析了 osgEarth 矢量系统的数据-样式分离架构与声明式渲染管道架构核心Feature数据、Style描述、GeometryCompiler转换的三元架构实现了数据与表现的完全解耦使得同一份矢量数据可通过不同样式动态呈现。样式系统类 CSS 的声明式样式表支持选择器、级联、表达式等高级特性可实现基于属性、空间关系、动态状态的复杂可视化效果。性能优化通过几何合并、实例化渲染、LOD 简化等机制在保持视觉效果的同时应对大规模矢量数据的渲染挑战。三维能力通过ExtrusionSymbol和AltitudeSymbol将二维 GIS 数据直接提升为三维体块并与地形精准贴合为三维 GIS 应用提供了强大支撑