代码拉取完成,页面将自动刷新
A maptalks Layer to render with three.js
npm install maptalks.three
.https://unpkg.com/maptalks.three/dist/maptalks.three.min.js
As a plugin, maptalks.three
must be loaded after maptalks.js
and three.js
in browsers.
<script type="text/javascript" src="https://unpkg.com/three@0.138.0/build/three.min.js"></script>
<script type="text/javascript" src="https://unpkg.com/maptalks/dist/maptalks.min.js"></script>
<script type="text/javascript" src="https://unpkg.com/maptalks.three/dist/maptalks.three.js"></script>
<script>
var threeLayer = new maptalks.ThreeLayer('t');
threeLayer.prepareToDraw = function (gl, scene, camera) {
var light = new THREE.DirectionalLight(0xffffff);
light.position.set(0, -10, -10).normalize();
scene.add(light);
var material = new THREE.MeshPhongMaterial();
countries.features.forEach(function (g) {
//g is geojson Feature
var num = g.properties.population;
var extrudePolygon=threeLayer.toExtrudePolygon(g, { height: num }, material);
threeLayer.addMesh(extrudePolygon)
});
};
map.addLayer(threeLayer);
</script>
With ES Modules:
import * as THREE from 'three';
import * as maptalks from 'maptalks';
import { ThreeLayer } from 'maptalks.three';
const map = new maptalks.Map('map', { /* options */ });
const threeLayer = new ThreeLayer('t');
threeLayer.prepareToDraw = function (gl, scene, camera) {
const light = new THREE.DirectionalLight(0xffffff);
light.position.set(0, -10, -10).normalize();
scene.add(light);
//...
};
threeLayer.addTo(map);
IE 11, Chrome, Firefox, other modern and mobile browsers that support WebGL;
We welcome any kind of contributions including issue reportings, pull requests, documentation corrections, feature requests and any other helps.
The only source file is index.js
.
It is written in ES6, transpiled by babel and tested with mocha and expect.js.
$ npm install
$ npm run dev
$ npm run build
$ npm run lint
npm version ${version}
npm publish
npm push master ${version}
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。