procedural-gl-js - 移动优先的 3D map引擎，注重用户体验

Created at: 2020-11-19 17:25:13

Language: JavaScript

编号: https://github.com/felixpalmer/procedural-gl-js

License: MPL-2.0

程序-gl.js

Procedural GL JS 是一个用于在网络上创建 3D map体验的库，用 JavaScript 和 WebGL 编写。它建立在THREE.js 之上。

它提供了一个易于使用但功能强大的框架，可以将美丽的户外风景嵌入到网页中。它加载速度超快，并针对移动设备进行了优化。

演示| 文档| 叠加游乐场| 海拔数据| 来源

主要特点

新型 GPU 驱动的细节层次系统可提供流畅的渲染，包括在移动设备上
在标准光栅图像切片中流式传输。支持来自各种提供商的 map图块
轻松包含 3D 地形的高程数据
强大的叠加功能。绘制清晰的标记和线条
深思熟虑的 API，无需处理 3D 概念即可构建复杂的应用程序
出色的用户体验和直观的控制，基于桌面的鼠标和基于移动的触摸
微小的文件大小意味着库的解析速度很快。由于代码剥离，包大小小于 THREE.js

截图

安装

npm install procedural-gl

用法

import Procedural from 'procedural-gl';

// Choose a DOM element into which the library should render
const container = document.getElementById( 'container' );

// Configure datasources
const datasource = {
  provider: 'maptiler',
  // To get a free key, use https://cloud.maptiler.com/account/?ref=procedural
  apiKey: 'GET_AN_API_KEY_FROM_MAPTILER'
};

// Initialize library and optionally add UI controls
Procedural.init( { container, datasource } );
Procedural.setRotationControlVisible( true );

// Load real-world location
const montBlanc = { latitude: 45.8326364, longitude: 6.8564201 };
Procedural.displayLocation( montBlanc );

连接到数据源

要使用库实际加载数据，你需要连接到数据源。进行设置的最快方法是在MapTiler上注册一个免费帐户，然后使用如上所示的 API 密钥。

有关设置数据源的详细说明，请参阅 wiki 中的此页面

例子

赞助

如果这个库对你有用，请考虑赞助该项目。

博客文章/指南

授权协议

Procedural GL JS 根据Mozilla Public License Version 2.0获得许可。

procedural-gl-js - 移动优先的 3D map引擎，注重用户体验

程序-gl.js

主要特点

截图

安装

用法

连接到数据源

例子

赞助

博客文章/指南

授权协议

About

Author：felixpalmer

热门帖子

热门github