Skip to content

Releases: maptalks/maptalks.three

v0.7.0

26 Dec 12:30
@deyihu deyihu
v0.7.0
aa02387
This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
GPG key ID: 4AEE18F83AFDEB23
Expired
Verified
Learn about vigilant mode.
Compare
Choose a tag to compare
v0.7.0

v0.7.0

Features

  • add BaseObject This is the base class for all 3D objects, All built-in drawing feature components are based on it. Its function and maptalks.geometry are as similar as possible. more#37. detailed information.
    If you're familiar with three.js. You can customize your own graphic elements based on it
//custom Circle component
 class Circle extends maptalks.BaseObject {
            constructor(coordinate, options, material, layer) {
                options = maptalks.Util.extend({}, OPTIONS, options, { layer, coordinate });
                super();
                //Initialize internal configuration
                // https://github.com/maptalks/maptalks.three/blob/1e45f5238f500225ada1deb09b8bab18c1b52cf2/src/BaseObject.js#L135
                this._initOptions(options);
                const { altitude, radius } = options;
                //generate geometry
                const r = layer.distanceToVector3(radius, radius).x
                const geometry = new THREE.CircleBufferGeometry(r, 50);

                //Initialize internal object3d
                // https://github.com/maptalks/maptalks.three/blob/1e45f5238f500225ada1deb09b8bab18c1b52cf2/src/BaseObject.js#L140
                this._createMesh(geometry, material);

                //set object3d position
                const z = layer.distanceToVector3(altitude, altitude).x;
                const position = layer.coordinateToVector3(coordinate, z);
                this.getObject3d().position.copy(position);
                // this.getObject3d().rotation.x = -Math.PI;
            }

        }

  • add Bar Graphical .Used to represent weighted points,For example, population density. more #36

  • add Bars Graphical .Large scale bar,Can provide higher performance. more#82

  • add Line Graphical .Used to represent a path . more#43

  • add Lines Graphical .Large scale line,Can provide higher performance . more#86

  • add Point Graphical . more#81

  • add Points Graphical .Large scale Point,Can provide higher performance,Support million level data rendering,It optimizes its hit detection performance with great care . more#81

  • add ExtrudePolygon Graphical .extrude polygon,Can be used to render buildings, administrative areas, etc . more#47

  • add ExtrudePolygons Graphical .Large scale ExtrudePolygon,Can provide higher performance,For example, to render building data at the city level . more#80

  • add ExtrudeLine Graphical .extrude line,Can buffer its height and width,it is base on geometry-extrude. more#44

  • add ExtrudeLines Graphical .Large scale ExtrudeLine,Can provide higher performance . more#83

  • add ExtrudeLineTrial Graphical .Trailing line,Flowing lines,It can be used to express traffic flow, etc . more#55

  • add Model Graphical .Model container,Can be used to accommodate any three.js supported model . more#52

  • ThreeLayer add more method .

    • toExtrudePolygon
    • toBar
    • toLine
    • toExtrudeLine
    • toModel
    • toExtrudeLineTrail
    • toExtrudePolygons
    • toPoint
    • toPoints
    • toBars
    • toExtrudeLines
    • toLines
    • addMesh #39
    • removeMesh #39
    • identify #41

Fixes

  • Lights and raycasters are not working properly(three.js>=r102) . more#30,#35

  • toExtrudeMesh BufferGeometry Not used . more#32

More Examples

  • bloom #66

  • arcline

  • circle

  • fatline

  • flight-path

  • linetrial

  • linetrip

  • oacean #65

  • sprite

  • terrain #73

Loading