From f3e11f7e27b3a9fff10abfb13e0bb8c5156a7045 Mon Sep 17 00:00:00 2001
From: thinkinggis <lzx199065@gmail.com>
Date: Wed, 3 Jul 2019 10:58:58 +0800
Subject: [PATCH] =?UTF-8?q?feat(layer):=20style=20=E5=A2=9E=E5=8A=A0blendi?=
 =?UTF-8?q?ng=20=E9=85=8D=E7=BD=AE=E9=A1=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 demos/01_animatePoint.html            | 3 +--
 demos/01_point_distribute.html        | 3 ++-
 demos/hz.html                         | 2 +-
 src/core/layer.js                     | 3 ++-
 src/geom/material/material.js         | 8 ++++++++
 src/layer/render/line/drawMeshLine.js | 2 +-
 src/layer/render/point/drawCircle.js  | 1 +
 src/layer/render/point/drawFill.js    | 1 +
 src/layer/render/point/drawNormal.js  | 4 +++-
 9 files changed, 20 insertions(+), 7 deletions(-)

diff --git a/demos/01_animatePoint.html b/demos/01_animatePoint.html
index 65c681a953..f1f7e61013 100644
--- a/demos/01_animatePoint.html
+++ b/demos/01_animatePoint.html
@@ -43,7 +43,6 @@ return {
   ]
  }
 }
-console.log(pointOnCircle(10))
 const scene = new L7.Scene({
   id: 'map',
   mapStyle: 'light', // 样式URL
@@ -76,7 +75,7 @@ scene.on('loaded', () => {
       circleLayer.setData(pointOnCircle(timestamp / 1000));
       requestAnimationFrame(animateMarker);
   }
-   //animateMarker(0);
+   animateMarker(0);
    
    /**
    const layerText =  scene.PointLayer({
diff --git a/demos/01_point_distribute.html b/demos/01_point_distribute.html
index a3d1bd8f73..2d5267344c 100644
--- a/demos/01_point_distribute.html
+++ b/demos/01_point_distribute.html
@@ -45,7 +45,8 @@ scene.on('loaded', () => {
     .style({
       stroke: 'rgb(255,255,255)',
       strokeWidth: 0,
-      opacity: 1.0
+      opacity: 1.0,
+      bending:'additive'
     })
      .render();
   });
diff --git a/demos/hz.html b/demos/hz.html
index 28a9d9cf41..fe2058e2a1 100644
--- a/demos/hz.html
+++ b/demos/hz.html
@@ -18,7 +18,7 @@
 <script src="https://webapi.amap.com/maps?v=1.4.8&key=15cd8a57710d40c9b7c0e3cc120f1200&plugin=Map3D"></script>
 <script src="./assets/jquery-3.2.1.min.js"></script>
 <script src="./assets/dat.gui.min.js"></script>
-<script src=" https://gw.alipayobjects.com/os/antv/pkg/_antv.l7-1.1.10/dist/l7.min.js"></script>
+<script src="https://gw.alipayobjects.com/os/antv/pkg/_antv.l7-1.2.0-beta.1/build/l7.js"></script>
 <script>
 var buildLayer =null;
 const scene = new L7.Scene({
diff --git a/src/core/layer.js b/src/core/layer.js
index c0d045c826..b1c8cfcac2 100644
--- a/src/core/layer.js
+++ b/src/core/layer.js
@@ -43,7 +43,8 @@ export default class Layer extends Base {
         strokeWidth: 1.0,
         opacity: 1.0,
         strokeOpacity: 1.0,
-        texture: false
+        texture: false,
+        blending: 'normal'
       },
       destroyed: false,
       // 选中时的配置项
diff --git a/src/geom/material/material.js b/src/geom/material/material.js
index d6b52304ce..11b1b0dccd 100644
--- a/src/geom/material/material.js
+++ b/src/geom/material/material.js
@@ -1,5 +1,10 @@
 
 import * as THREE from '../../core/three';
+const blendingEnum = {
+  normal: 'NormalBlending',
+  additive: 'AdditiveBlending',
+  subtractive: 'SubtractiveBlending'
+};
 export default class Material extends THREE.ShaderMaterial {
   setUniformsValue(name, value) {
     if (!this.uniforms[name]) { return; }
@@ -26,4 +31,7 @@ export default class Material extends THREE.ShaderMaterial {
       }
     }
   }
+  setBending(type) {
+    this.blending = THREE[blendingEnum[type]] || THREE.NormalBlending;
+  }
 }
diff --git a/src/layer/render/line/drawMeshLine.js b/src/layer/render/line/drawMeshLine.js
index 1b955faef7..c77881a3cb 100644
--- a/src/layer/render/line/drawMeshLine.js
+++ b/src/layer/render/line/drawMeshLine.js
@@ -34,7 +34,7 @@ export default function DrawLine(layerData, layer) {
     ANIMATE: false,
     DASHLINE: style.lineType === 'dash'
   });
-
+  lineMaterial.setBending(style.blending);
   const lineMesh = new THREE.Mesh(geometry, lineMaterial);
   if (animateOptions.enable) {
     layer.scene.startAnimate();
diff --git a/src/layer/render/point/drawCircle.js b/src/layer/render/point/drawCircle.js
index e602ef938d..dfc837bfa2 100644
--- a/src/layer/render/point/drawCircle.js
+++ b/src/layer/render/point/drawCircle.js
@@ -24,6 +24,7 @@ export default function drawCircle(layerData, layer) {
     u_stroke_opacity: style.strokeOpacity
   });
   material.depthTest = false;
+  material.setBending(style.blending);
   const fillMesh = new THREE.Mesh(geometry, material);
   aPosition.length = 0;
   aPackedData.length = 0;
diff --git a/src/layer/render/point/drawFill.js b/src/layer/render/point/drawFill.js
index cc2fcf741e..ec70856cea 100644
--- a/src/layer/render/point/drawFill.js
+++ b/src/layer/render/point/drawFill.js
@@ -43,6 +43,7 @@ export default function DrawFill(layerData, layer) {
   });
   material.setDefinesvalue('SHAPE', true);
   material.depthTest = false;
+  material.setBending(style.blending);
   const fillMesh = new THREE.Mesh(geometry, material);
   if (style.stroke !== 'none') {
     // 是否绘制边界
diff --git a/src/layer/render/point/drawNormal.js b/src/layer/render/point/drawNormal.js
index c851e85341..41d5d7d702 100644
--- a/src/layer/render/point/drawNormal.js
+++ b/src/layer/render/point/drawNormal.js
@@ -4,6 +4,7 @@
 import * as THREE from '../../../core/three';
 import * as PointBuffer from '../../../geom/buffer/point/index';
 import PointMaterial from '../../../geom/material/pointMaterial';
+
 export default function DrawNormal(layerData, layer) {
   const geometry = new THREE.BufferGeometry();
   const style = layer.get('styleOptions');
@@ -20,7 +21,8 @@ export default function DrawNormal(layerData, layer) {
   }, {
     SHAPE: false,
     TEXCOORD_0: false
-  });
+  }, style);
+  material.setBending(style.blending);
   const strokeMesh = new THREE.Points(geometry, material);
   return strokeMesh;
 }