From 9dd399351995f3535466982f7b39bf520275685c Mon Sep 17 00:00:00 2001
From: 2912401452 <2912401452@qq.com>
Date: Mon, 31 May 2021 20:04:34 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=A1=88=E4=BE=8Bdemo=E4=BF=AE?=
=?UTF-8?q?=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
examples/point/text/demo/iconfont.js | 9 ++---
examples/point/text/demo/iconfonts.js | 39 +++++++++++++---------
examples/point/text/demo/meta.json | 16 ++++-----
examples/point/text/demo/temperture.js | 4 +--
examples/point/text/demo/updown.js | 4 +--
stories/3D_Model/Components/amap_three.tsx | 5 +--
stories/3D_Model/model.stories.tsx | 2 +-
stories/Map/components/mapCenter.tsx | 4 +--
8 files changed, 46 insertions(+), 37 deletions(-)
diff --git a/examples/point/text/demo/iconfont.js b/examples/point/text/demo/iconfont.js
index 7e902a132f..ace6447a89 100644
--- a/examples/point/text/demo/iconfont.js
+++ b/examples/point/text/demo/iconfont.js
@@ -4,10 +4,11 @@ import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new GaodeMap({
- center: [ 115, 30 ],
+ center: [ 110, 30 ],
pitch: 0,
- style: 'light',
- zoom: 6
+ // style: 'light',
+ style: 'amap://styles/453e2f8e11603fc8f7548fe18959e9e9',
+ zoom: 5
})
});
const fontFamily = 'iconfont';
@@ -31,7 +32,7 @@ scene.on('loaded', () => {
})
.shape('icon', 'text')
.size(20)
- .color('w', [ '#f0f9e8', '#bae4bc', '#7bccc4', '#43a2ca', '#0868ac' ])
+ .color('w', ['#a6cee3','#1f78b4','#b2df8a','#33a02c','#fb9a99'])
.style({
textAnchor: 'center', // 文本相对锚点的位置 center|left|right|top|bottom|top-left
textOffset: [ 40, 0 ], // 文本相对锚点的偏移量 [水平, 垂直]
diff --git a/examples/point/text/demo/iconfonts.js b/examples/point/text/demo/iconfonts.js
index 495d21c802..6a68dacc95 100644
--- a/examples/point/text/demo/iconfonts.js
+++ b/examples/point/text/demo/iconfonts.js
@@ -12,13 +12,20 @@ const scene = new Scene({
viewMode: '2D'
})
});
+const dataColor = {
+ bigRainBC: "#285A8C",
+ middleRainBC: "#326EA0",
+ smallRainBC: "#4678AA",
+ sunBC: "#00BFFF",
+ cloudBC: "#1E90FF"
+}
const originData = [
{
lng: 121.7,
lat: 30.6,
iconType: 'hugeRain',
iconColor: '#4678D2',
- backgoundColor: '#285A8C',
+ backgoundColor: dataColor.bigRainBC,
temperature: '20℃',
weather: '大雨'
},
@@ -27,7 +34,7 @@ const originData = [
lat: 30.0,
iconType: 'smallRain',
iconColor: '#6EA0FF',
- backgoundColor: '#4678AA',
+ backgoundColor: dataColor.smallRainBC,
temperature: '22℃',
weather: '小雨'
},
@@ -36,7 +43,7 @@ const originData = [
lat: 30.2,
iconType: 'sun',
iconColor: '#FFA500',
- backgoundColor: '#00BFFF',
+ backgoundColor: dataColor.sunBC,
temperature: '28℃',
weather: '晴朗'
},
@@ -45,7 +52,7 @@ const originData = [
lat: 30.6,
iconType: 'sun',
iconColor: '#FFA500',
- backgoundColor: '#00BFFF',
+ backgoundColor: dataColor.sunBC,
temperature: '28℃',
weather: '晴朗'
},
@@ -54,7 +61,7 @@ const originData = [
lat: 30,
iconType: 'sun',
iconColor: '#FFA500',
- backgoundColor: '#00BFFF',
+ backgoundColor: dataColor.sunBC,
temperature: '28℃',
weather: '晴朗'
},
@@ -63,7 +70,7 @@ const originData = [
lat: 30.5,
iconType: 'sun',
iconColor: '#FFA500',
- backgoundColor: '#00BFFF',
+ backgoundColor: dataColor.sunBC,
temperature: '28℃',
weather: '晴朗'
},
@@ -72,7 +79,7 @@ const originData = [
lat: 31.4,
iconType: 'cloud',
iconColor: '#F0F8FF',
- backgoundColor: '#1E90FF',
+ backgoundColor: dataColor.cloudBC,
temperature: '22℃',
weather: '多云'
},
@@ -81,7 +88,7 @@ const originData = [
lat: 31,
iconType: 'cloud',
iconColor: '#F0F8FF',
- backgoundColor: '#1E90FF',
+ backgoundColor: dataColor.cloudBC,
temperature: '22℃',
weather: '多云'
},
@@ -90,7 +97,7 @@ const originData = [
lat: 30.8,
iconType: 'cloud',
iconColor: '#F0F8FF',
- backgoundColor: '#1E90FF',
+ backgoundColor: dataColor.cloudBC,
temperature: '22℃',
weather: '多云'
},
@@ -99,7 +106,7 @@ const originData = [
lat: 31.3,
iconType: 'cloud',
iconColor: '#F0F8FF',
- backgoundColor: '#1E90FF',
+ backgoundColor: dataColor.cloudBC,
temperature: '22℃',
weather: '多云'
},
@@ -108,7 +115,7 @@ const originData = [
lat: 30.2,
iconType: 'smallRain',
iconColor: '#6EA0FF',
- backgoundColor: '#4678AA',
+ backgoundColor: dataColor.smallRainBC,
temperature: '22℃',
weather: '小雨'
},
@@ -117,7 +124,7 @@ const originData = [
lat: 30.5,
iconType: 'smallRain',
iconColor: '#6EA0FF',
- backgoundColor: '#4678AA',
+ backgoundColor: dataColor.smallRainBC,
temperature: '22℃',
weather: '小雨'
},
@@ -126,7 +133,7 @@ const originData = [
lat: 30,
iconType: 'middleRain',
iconColor: '#6495ED',
- backgoundColor: '#326EA0',
+ backgoundColor: dataColor.middleRainBC,
temperature: '24℃',
weather: '中雨'
},
@@ -135,7 +142,7 @@ const originData = [
lat: 29.7,
iconType: 'smallRain',
iconColor: '#6EA0FF',
- backgoundColor: '#4678AA',
+ backgoundColor: dataColor.smallRainBC,
temperature: '22℃',
weather: '小雨'
},
@@ -144,7 +151,7 @@ const originData = [
lat: 29.8,
iconType: 'middleRain',
iconColor: '#6495ED',
- backgoundColor: '#326EA0',
+ backgoundColor: dataColor.middleRainBC,
temperature: '24℃',
weather: '中雨'
},
@@ -153,7 +160,7 @@ const originData = [
lat: 30,
iconType: 'hugeRain',
iconColor: '#4678D2',
- backgoundColor: '#285A8C',
+ backgoundColor: dataColor.bigRainBC,
temperature: '20℃',
weather: '大雨'
}
diff --git a/examples/point/text/demo/meta.json b/examples/point/text/demo/meta.json
index 4a8437389d..7a64d0bc4b 100644
--- a/examples/point/text/demo/meta.json
+++ b/examples/point/text/demo/meta.json
@@ -9,30 +9,30 @@
"title": "点数据标注",
"screenshot": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*7blvQ4v7Q1UAAAAAAAAAAABkARQnAQ"
},
- {
- "filename": "iconfont.js",
- "title": "图标标注",
- "screenshot": "https://gw.alipayobjects.com/mdn/rms_23a451/afts/img/A*jnPwQZsY-bEAAAAAAAAAAAAAARQnAQ"
- },
{
"filename": "polygon_text.js",
"title": "面数据标注",
"screenshot": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*rCFqRp3iQosAAAAAAAAAAABkARQnAQ"
},
+ {
+ "filename": "iconfont.js",
+ "title": "图标标注",
+ "screenshot": "https://gw.alipayobjects.com/mdn/rms_23a451/afts/img/A*8PfqQ6-lQ0EAAAAAAAAAAAAAARQnAQ"
+ },
{
"filename": "iconfonts.js",
"title": "天气图标标注",
- "screenshot": "https://gw.alipayobjects.com/mdn/rms_23a451/afts/img/A*AouOQ4VYTJMAAAAAAAAAAAAAARQnAQ"
+ "screenshot": "https://gw.alipayobjects.com/mdn/rms_23a451/afts/img/A*JAhxTaabap4AAAAAAAAAAAAAARQnAQ"
},
{
"filename": "temperture.js",
"title": "气温图标标注",
- "screenshot": "https://gw.alipayobjects.com/mdn/rms_23a451/afts/img/A*spetRL1JnfsAAAAAAAAAAAAAARQnAQ"
+ "screenshot": "https://gw.alipayobjects.com/mdn/rms_23a451/afts/img/A*36umQaf_hVEAAAAAAAAAAAAAARQnAQ"
},
{
"filename": "updown.js",
"title": "走势图标标注",
- "screenshot": "https://gw.alipayobjects.com/mdn/rms_23a451/afts/img/A*5E4DR4H8qDQAAAAAAAAAAAAAARQnAQ"
+ "screenshot": "https://gw.alipayobjects.com/mdn/rms_23a451/afts/img/A*P5plS5ZsYZkAAAAAAAAAAAAAARQnAQ"
}
]
}
diff --git a/examples/point/text/demo/temperture.js b/examples/point/text/demo/temperture.js
index d7c6726efd..4bf45f9a84 100644
--- a/examples/point/text/demo/temperture.js
+++ b/examples/point/text/demo/temperture.js
@@ -43,9 +43,9 @@ scene.on('loaded', () => {
})
.source(data)
.shape('fill')
- .color('count', [ 'rgb(194, 143, 133)', 'rgb(148, 167, 192)' ])
+ .color('count', ['#f2f0f7','#dadaeb','#bcbddc','#9e9ac8','#756bb1','#54278f'])
.style({
- opacity: 0.5
+ opacity: 0.6
});
scene.addLayer(filllayer);
diff --git a/examples/point/text/demo/updown.js b/examples/point/text/demo/updown.js
index 876b8cf0b7..33fd94432d 100644
--- a/examples/point/text/demo/updown.js
+++ b/examples/point/text/demo/updown.js
@@ -30,9 +30,9 @@ scene.on('loaded', () => {
})
.source(data)
.shape('fill')
- .color('count', [ 'rgb(194, 143, 133)', 'rgb(148, 167, 192)' ])
+ .color('count', ['#f2f0f7','#dadaeb','#bcbddc','#9e9ac8','#756bb1','#54278f'])
.style({
- opacity: 0.5
+ opacity: 0.6
});
scene.addLayer(filllayer);
diff --git a/stories/3D_Model/Components/amap_three.tsx b/stories/3D_Model/Components/amap_three.tsx
index c63957acd3..8288ebc056 100644
--- a/stories/3D_Model/Components/amap_three.tsx
+++ b/stories/3D_Model/Components/amap_three.tsx
@@ -1,5 +1,5 @@
import { Scene } from '@antv/l7';
-import { GaodeMap, Mapbox } from '@antv/l7-maps';
+import { GaodeMap, Mapbox, GaodeMapV1 } from '@antv/l7-maps';
import { ThreeLayer, ThreeRender } from '@antv/l7-three';
import * as React from 'react';
// import { DirectionalLight, Scene as ThreeScene } from 'three';
@@ -23,7 +23,8 @@ export default class GlTFThreeJSDemo extends React.Component {
const scene = new Scene({
id: 'map',
- map: new GaodeMap({
+ // map: new GaodeMap({
+ map: new GaodeMapV1({
center: [111.4453125, 32.84267363195431],
pitch: 45,
rotation: 30,
diff --git a/stories/3D_Model/model.stories.tsx b/stories/3D_Model/model.stories.tsx
index 1da45ee792..b031ad6727 100644
--- a/stories/3D_Model/model.stories.tsx
+++ b/stories/3D_Model/model.stories.tsx
@@ -6,5 +6,5 @@ import ThreeRender from './Components/threeRender';
storiesOf('3D 模型', module)
.add('ThreeJS Render', () => , {})
- .add('高德模型', () => , {})
+ .add('高德模型1.x', () => , {})
.add('Mapbox模型', () => , {});
diff --git a/stories/Map/components/mapCenter.tsx b/stories/Map/components/mapCenter.tsx
index 0018b15100..e11654a232 100644
--- a/stories/Map/components/mapCenter.tsx
+++ b/stories/Map/components/mapCenter.tsx
@@ -1,6 +1,6 @@
// @ts-ignore
import { ILngLat, PointLayer, PolygonLayer, Scene } from '@antv/l7';
-import { GaodeMap } from '@antv/l7-maps';
+import { GaodeMap, GaodeMapV1 } from '@antv/l7-maps';
import * as React from 'react';
export default class GaodeMapComponent extends React.Component {
@@ -14,7 +14,7 @@ export default class GaodeMapComponent extends React.Component {
public async componentDidMount() {
const scene = new Scene({
id: 'map',
- map: new GaodeMap({
+ map: new GaodeMapV1({
center: [121.107846, 30.267069],
pitch: 0,
style: 'normal',