@maptec/maptec-js
v1.0.4
Published
Maptec GL JS - 基于WebGL的地图引擎库，用于构建Web地图应用。
Readme
Maptec GL JS
Maptec GL JS 是一个用于在网站或基于 webview 的应用中发布地图的开源库。通过 GPU 加速的矢量瓦片渲染实现快速地图显示。
安装
npm install @maptec/maptec-js或：
pnpm add @maptec/maptec-js在项目中使用（推荐：打包工具）
import Maptec from '@maptec/maptec-js';
import '@maptec/maptec-js/maptec.css';
const map = new Maptec.Map({
container: 'map',
style: 'https://demotiles.maplibre.org/style.json',
center: [116.3974, 39.9093],
zoom: 10,
});对应 HTML：
<div id="map" style="height: 100vh"></div>通过 CDN 引入（UMD，全局变量 Maptec）
以 @maptec/maptec-js 为例：
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Maptec CDN Demo</title>
<link rel="stylesheet" href="https://unpkg.com/@maptec/maptec-js/maptec.css" />
<style>
html, body { margin: 0; height: 100%; }
#map { width: 100%; height: 100%; }
</style>
</head>
<body>
<div id="map"></div>
<script src="https://unpkg.com/@maptec/maptec-js"></script>
<script>
const map = new Maptec.Map({
container: 'map',
style: 'https://demotiles.maplibre.org/style.json',
center: [116.3974, 39.9093],
zoom: 10,
});
</script>
</body>
</html>也可用 jsDelivr：
https://cdn.jsdelivr.net/npm/@maptec/maptec-jshttps://cdn.jsdelivr.net/npm/@maptec/maptec-js/maptec.css
常见问题
- 为什么必须引入 CSS？：
maptec.css包含默认样式（控件、字体等），缺失会导致显示异常。 - 在浏览器里怎么拿到对象？：CDN 方式会暴露全局
Maptec；打包工具（Vite、webpack 等）使用import Maptec from '@maptec/maptec-js'。
License
BSD-3-Clause，详见 LICENSE。