88 lines
2.7 KiB
Markdown
88 lines
2.7 KiB
Markdown
---
|
||
title: Feature
|
||
date: 2020-10-10
|
||
author: ac
|
||
tags:
|
||
- OpenLayers
|
||
- Feature
|
||
categories:
|
||
- GIS
|
||
---
|
||
|
||
## 1. Feature
|
||
|
||
> 我们把现实世界中实体，如：道路、行政边界、电线杆等等，抽象为要素（`Feature`）。
|
||
|
||
一个要素（`Feature`）包含一个几何对象（`Geometry`）来表述物体的空间几何信息和属性（`Attributes`）来描述物体的其他信息。
|
||
|
||
```
|
||
Feature
|
||
↙ ↘
|
||
Geometry Attributes
|
||
↙ ↓ ↘
|
||
Point Polyline Polygon
|
||
```
|
||
|
||
## 2. ol中的Feature
|
||
|
||
`ol`中`ol.Feature`作为一个矢量对象存储矢量数据，包含几何对象（`geometry`）和其他自定义的属性信息，即 `{k:v}`，其中有个geometry的key，其他都是自定义的key。
|
||
|
||
`Feature`中常用的方法：
|
||
|
||
- `setStyle(style)`:为要素渲染样式,style可以是单个也可以是数组；
|
||
- `getGeometry()`：获取要素中的几何对象；
|
||
- `setGeometryName()`：当要素在创建时的对象中有多个value值是几何对象时，可以通过该方法指定要渲染的几何对象。默认是key为geometry的几何对象。
|
||
|
||
```javascript
|
||
var feature = new Feature({
|
||
geometry: new Polygon(polyCoords),
|
||
labelPoint: new Point(labelCoords),
|
||
name: 'My Polygon'
|
||
});
|
||
|
||
// get the polygon geometry
|
||
var poly = feature.getGeometry();
|
||
|
||
// Render the feature as a point using the coordinates from labelPoint
|
||
feature.setGeometryName('labelPoint');
|
||
|
||
// get the point geometry
|
||
var point = feature.getGeometry();
|
||
```
|
||
|
||
创建`Feature`实例除了使用构造器以外，针对一些特殊格式（`XML`、`WKT`、`TopoJSON`、`KML`、`GML`等）的数据可以使用`format`解析器创建。
|
||
|
||
```javascript
|
||
var wktString = "POLYGON((12724298.889 2576595.308,12721929.341 2568340.109,12716960.934 2564900.445,12724298.889 2576595.308))";
|
||
var wtkFeature = (new ol.format.WKT()).readFeature(wktString,{dataProject:'EPSG:3857',featureProject:'EPSG:3857'});
|
||
```
|
||
|
||
> `TopoJSON`是`GeoJSON`按拓扑学编码后的扩展形式。使用点、弧（有向线）来表示的图形
|
||
|
||
|
||
|
||
## 3. 创建方式
|
||
|
||
方式一：使用 Feature 构造器创建
|
||
|
||
```javascript
|
||
var pointFeature = new ol.Feature({
|
||
geometry: new ol.geom.Point([12703928.421,2575539.521]),
|
||
name: '点要素'
|
||
});
|
||
```
|
||
|
||
|
||
|
||
方式二：使用 format 解析器创建，针对一些特殊格式的数据
|
||
|
||
```javascript
|
||
var wktString = "POLYGON((12724298.889 2576595.308,12721929.341 2568340.109,12716960.934 2564900.445,12724298.889 2576595.308))";
|
||
|
||
//创建解析wkt格式的解析器对象
|
||
var wktformat = new ol.format.WKT();
|
||
//读取wkt文本
|
||
var wtkFeature = wktformat.readFeature(wktString,{dataProject:'EPSG:3857',featureProject:'EPSG:3857'});
|
||
```
|
||
|