mirror of https://gitee.com/antv-l7/antv-l7
fix: 小程序场景增加scene 增加开关
This commit is contained in:
parent
c5894c9659
commit
6242f3c0ff
|
@ -0,0 +1,79 @@
|
||||||
|
// @ts-ignore
|
||||||
|
import { PointLayer, Scene,Popup } from '@antv/l7';
|
||||||
|
// @ts-ignore
|
||||||
|
import { GaodeMap, Mapbox } from '@antv/l7-maps';
|
||||||
|
import React, { useEffect } from 'react';
|
||||||
|
|
||||||
|
export default () => {
|
||||||
|
// @ts-ignore
|
||||||
|
useEffect( async () => {
|
||||||
|
const response = await fetch(
|
||||||
|
'https://gw.alipayobjects.com/os/basement_prod/893d1d5f-11d9-45f3-8322-ee9140d288ae.json',
|
||||||
|
);
|
||||||
|
let shapeType = '01'
|
||||||
|
const scene = new Scene({
|
||||||
|
id: 'map',
|
||||||
|
map: new GaodeMap({
|
||||||
|
center: [121.4, 31.258134],
|
||||||
|
zoom: 14,
|
||||||
|
pitch: 0,
|
||||||
|
style: 'normal',
|
||||||
|
doubleClickZoom:false,
|
||||||
|
}),
|
||||||
|
});
|
||||||
|
scene.addImage(
|
||||||
|
'00',
|
||||||
|
'https://gw.alipayobjects.com/mdn/rms_fcd5b3/afts/img/A*g8cUQ7pPT9YAAAAAAAAAAAAAARQnAQ',
|
||||||
|
);
|
||||||
|
scene.addImage(
|
||||||
|
'01',
|
||||||
|
'https://gw.alipayobjects.com/mdn/rms_fcd5b3/afts/img/A*LTcXTLBM7kYAAAAAAAAAAAAAARQnAQ',
|
||||||
|
);
|
||||||
|
scene.addImage(
|
||||||
|
'02',
|
||||||
|
'https://gw.alipayobjects.com/zos/bmw-prod/904d047a-16a5-461b-a921-98fa537fc04a.svg',
|
||||||
|
);
|
||||||
|
const data = await response.json();
|
||||||
|
const newData = data.map((item: any) => {
|
||||||
|
item.type = ['00', '01', '02'][Math.floor(Math.random() * 3)];
|
||||||
|
return item;
|
||||||
|
});
|
||||||
|
const imageLayer = new PointLayer({
|
||||||
|
autoFit:false
|
||||||
|
})
|
||||||
|
.source(newData, {
|
||||||
|
parser: {
|
||||||
|
type: 'json',
|
||||||
|
x: 'longitude',
|
||||||
|
y: 'latitude',
|
||||||
|
},
|
||||||
|
})
|
||||||
|
.shape('type', (v: any) => {
|
||||||
|
return shapeType;
|
||||||
|
})
|
||||||
|
.active(false)
|
||||||
|
.size(20);
|
||||||
|
scene.addLayer(imageLayer);
|
||||||
|
setTimeout(()=>{
|
||||||
|
shapeType = '02';
|
||||||
|
// imageLayer.shape('type', (v: any) => {
|
||||||
|
// console.log(1111,shapeType)
|
||||||
|
// return shapeType;
|
||||||
|
// })
|
||||||
|
imageLayer.shape('02');
|
||||||
|
// scene.render()
|
||||||
|
|
||||||
|
},2000)
|
||||||
|
|
||||||
|
}, []);
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
id="map"
|
||||||
|
style={{
|
||||||
|
height: '500px',
|
||||||
|
position: 'relative',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
|
@ -0,0 +1,2 @@
|
||||||
|
### Point - Shape
|
||||||
|
<code src="./demos/shape.tsx"></code>
|
|
@ -16,6 +16,7 @@ const defaultSceneConfig: Partial<ISceneConfig & IRenderConfig> = {
|
||||||
logoVisible: true,
|
logoVisible: true,
|
||||||
antialias: true,
|
antialias: true,
|
||||||
stencil: true,
|
stencil: true,
|
||||||
|
isMini: false,
|
||||||
preserveDrawingBuffer: false,
|
preserveDrawingBuffer: false,
|
||||||
pickBufferScale: 1.0,
|
pickBufferScale: 1.0,
|
||||||
fitBoundsOptions: {
|
fitBoundsOptions: {
|
||||||
|
|
|
@ -11,6 +11,7 @@ export interface ISceneConfig extends IRenderConfig {
|
||||||
map: IMapWrapper;
|
map: IMapWrapper;
|
||||||
logoPosition?: PositionName;
|
logoPosition?: PositionName;
|
||||||
logoVisible?: boolean;
|
logoVisible?: boolean;
|
||||||
|
isMini?: boolean; // 是否是小程序场景
|
||||||
animate?: boolean;
|
animate?: boolean;
|
||||||
fitBoundsOptions?: unknown;
|
fitBoundsOptions?: unknown;
|
||||||
pickBufferScale?: number;
|
pickBufferScale?: number;
|
||||||
|
|
|
@ -32,7 +32,7 @@ import {
|
||||||
} from '@antv/l7-core';
|
} from '@antv/l7-core';
|
||||||
import { MaskLayer } from '@antv/l7-layers';
|
import { MaskLayer } from '@antv/l7-layers';
|
||||||
import { ReglRendererService } from '@antv/l7-renderer';
|
import { ReglRendererService } from '@antv/l7-renderer';
|
||||||
import { DOM, isMini } from '@antv/l7-utils';
|
import { DOM, isMini, setMiniScene } from '@antv/l7-utils';
|
||||||
import { Container } from 'inversify';
|
import { Container } from 'inversify';
|
||||||
import BoxSelect, { BoxSelectEventList } from './boxSelect';
|
import BoxSelect, { BoxSelectEventList } from './boxSelect';
|
||||||
import ILayerManager from './ILayerManager';
|
import ILayerManager from './ILayerManager';
|
||||||
|
@ -99,6 +99,7 @@ class Scene
|
||||||
);
|
);
|
||||||
this.popupService = sceneContainer.get<IPopupService>(TYPES.IPopupService);
|
this.popupService = sceneContainer.get<IPopupService>(TYPES.IPopupService);
|
||||||
this.boxSelect = new BoxSelect(this, {});
|
this.boxSelect = new BoxSelect(this, {});
|
||||||
|
setMiniScene(config?.isMini|| false);
|
||||||
|
|
||||||
if (isMini) {
|
if (isMini) {
|
||||||
this.sceneService.initMiniScene(config);
|
this.sceneService.initMiniScene(config);
|
||||||
|
|
|
@ -91,6 +91,11 @@ const scene = new L7.Scene({
|
||||||
|
|
||||||
是否保留缓冲区数据 `boolean` `false`。
|
是否保留缓冲区数据 `boolean` `false`。
|
||||||
|
|
||||||
|
### isMini
|
||||||
|
<description> _boolean_ **可选** _default: false_ </description>
|
||||||
|
|
||||||
|
是否小程序模式 `boolean` `false`,目前仅支持支付宝
|
||||||
|
|
||||||
## Layer 方法
|
## Layer 方法
|
||||||
|
|
||||||
### addLayer(layer): void 增加图层对象
|
### addLayer(layer): void 增加图层对象
|
||||||
|
|
|
@ -29,6 +29,11 @@ import { $XMLHttpRequest as $XMLHttpRequest2 } from './XMLHttpRequest';
|
||||||
|
|
||||||
import { globalWindow, l7globalThis } from './global';
|
import { globalWindow, l7globalThis } from './global';
|
||||||
|
|
||||||
|
export let isMiniScene = false;
|
||||||
|
export function setMiniScene(flag: boolean) {
|
||||||
|
isMiniScene = flag;
|
||||||
|
}
|
||||||
|
|
||||||
// 判断时候是支付宝小程序环境 ( my.isFRM == true smallfish H5+ )
|
// 判断时候是支付宝小程序环境 ( my.isFRM == true smallfish H5+ )
|
||||||
export const isMiniAli =
|
export const isMiniAli =
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
|
@ -42,7 +47,7 @@ export const isWeChatMiniProgram =
|
||||||
wx !== null &&
|
wx !== null &&
|
||||||
(typeof wx.request !== 'undefined' || typeof wx.miniProgram !== 'undefined');
|
(typeof wx.request !== 'undefined' || typeof wx.miniProgram !== 'undefined');
|
||||||
|
|
||||||
export const isMini = isMiniAli || isWeChatMiniProgram;
|
export const isMini = (isMiniAli || isWeChatMiniProgram) && isMiniScene;
|
||||||
|
|
||||||
export const miniWindow = {
|
export const miniWindow = {
|
||||||
atob,
|
atob,
|
||||||
|
|
Loading…
Reference in New Issue