OpenLayers 教程

地图开发工作中，有时候需要模拟一些数据，之前都是手动用循环创建，数据太有规律，不好用，于是搞个在线工具。

工具是使用 turf.js 实现的，效率还可以，仅限于小数据量，大数据量模拟，建议通过后台实现。

这里放上核心代码，完整代码详见在线示例。

使用 Turf.js 模拟随机数据

// 模拟随机点数据
const points = turf.randomPoint(
    // 模拟数量
    25,
    {
        // 范围
        bbox: [115.11343196896966, 38.053632016866445, 116.22305110959466, 39.558758969991445]
    })

// 模拟随机线段数据
const lineStrings = turf.randomLineString(
    // 模拟数量
    25,
    {
        // 范围
        bbox: [115.11343196896966, 38.053632016866445, 116.22305110959466, 39.558758969991445],
        // 顶点数量
        num_vertices: 10,
        // 最大长度
        max_length: 0.1,
        // 最大角度
        max_rotation: Math.PI / 8
    })

// 模拟随机多边形
const polygons = turf.randomPolygon(
    // 模拟数量
    25,
    {
        // 范围
        bbox: [115.11343196896966, 38.053632016866445, 116.22305110959466, 39.558758969991445],
        // 最大辐射长度
        max_radial_length: 0.1,
        // 顶点数量
        num_vertices: 10
    })
// 可以查看一下，这里数据为 geojson 对象数据
console.log(points);
// geojson 创建 feature 对象
console.log(getFeatureByGeoJson(points));

/**
 * @todo 图形对象转化成GeoJson格式数据(postgis)
 * @param {string|object} geojson geojson字符串或者对象
 * @param {string|Projection} sourceCode 源投影坐标系
 * @param {string|Projection} targetCode 目标投影坐标系
 * @returns {Feature}
 */
function getFeatureByGeoJson(geojson, sourceCode, targetCode) {

    let view = map.getView();

    if (!geojson) {
        return null;
    }

    let feature;

    if ((typeof geojson) == 'string') {
        // 替换 null 字符
        while (geojson.indexOf('null') != -1) {
            // geojson = geojson
            geojson = geojson.replace("null", "");
        }
    }

    feature = (new ol.format.GeoJSON()).readFeatures(geojson, {
        dataProjection: sourceCode || view.getProjection(),    // 设定JSON数据使用的坐标系
        featureProjection: targetCode || view.getProjection() // 设定当前地图使用的feature的坐标系
    });

    return feature;
}

在线示例

Openlayers 生成随机坐标：Openlayers random feature

Cesium 生成随机坐标：Cesium random feature