fix(map): temporarily closed amap offset coordinate

This commit is contained in:
thinkinggis 2019-11-29 11:19:04 +08:00
parent 2401eb0208
commit b306e4ce1d
6 changed files with 80 additions and 8 deletions

View File

@ -1,9 +1,9 @@
module.exports = ({ config }) => {
// config.module.rules.push({
// test: /\.glsl$/,
// loader: 'raw-loader'
// });
config.module.rules.push({
test: /\.glsl$/,
loader: 'raw-loader'
});
// config.module.rules.push({
// test: /\.worker\.(js|ts)$/,

View File

@ -48,7 +48,7 @@ export default class Control extends EventEmitter {
};
}
public setPosition(position: PositionName) {
// FIXME: 只是改变位置不需要销毁再重建吧
// 考虑组件的自动布局,需要销毁重建
// const controlService = this.controlService;
// if (controlService) {
// controlService.removeControl(this);

View File

@ -105,8 +105,7 @@ vec2 project_pixel_size_to_clipspace(vec2 pixels) {
}
float project_pixel(float pixel) {
if (u_CoordinateSystem == COORDINATE_SYSTEM_P20
|| u_CoordinateSystem == COORDINATE_SYSTEM_P20_OFFSET) {
if (u_CoordinateSystem == COORDINATE_SYSTEM_P20) {
// P20 坐标系下,为了和 Web 墨卡托坐标系统一zoom 默认减1
return pixel * pow(2.0, (19.0 - u_Zoom));
}

View File

@ -33,7 +33,7 @@ let amapLoaded = false;
*
*/
let pendingResolveQueue: Array<() => void> = [];
const LNGLAT_OFFSET_ZOOM_THRESHOLD = 12;
const LNGLAT_OFFSET_ZOOM_THRESHOLD = 20; // 暂时关闭 fix 统一不同坐标系,不同底图的高度位置
/**
* AMapService

View File

@ -2,6 +2,7 @@ import { storiesOf } from '@storybook/react';
import * as React from 'react';
import Arc2DLineDemo from './components/Arc2DLine';
import ArcLineDemo from './components/Arcline';
import Column from './components/column';
import HeatMapDemo from './components/HeatMap';
import GridHeatMap from './components/HeatmapGrid';
import LineLayer from './components/Line';
@ -16,6 +17,7 @@ import RasterLayerDemo from './components/RasterLayer';
storiesOf('图层', module)
.add('点图层', () => <PointDemo />)
.add('3D点', () => <Point3D />)
.add('Column', () => <Column />)
.add('图片标注', () => <PointImage />)
.add('面3d图层', () => <Polygon3D />)
.add('线图层', () => <LineLayer />)

View File

@ -0,0 +1,71 @@
import { PointLayer, Scene } from '@antv/l7';
import { GaodeMap } from '@antv/l7-maps';
import * as React from 'react';
// @ts-ignore
import data from '../data/data.json';
export default class Column extends React.Component {
// @ts-ignore
private scene: Scene;
public componentWillUnmount() {
this.scene.destroy();
}
public componentDidMount() {
const scene = new Scene({
id: 'map',
map: new GaodeMap({
pitch: 66.02383,
style: 'dark',
center: [ 121.400257, 31.25287 ],
zoom: 14.55,
rotation: 134.9507
})
});
fetch(
'https://gw.alipayobjects.com/os/basement_prod/893d1d5f-11d9-45f3-8322-ee9140d288ae.json'
)
.then(res => res.json())
.then(data => {
const pointLayer = new PointLayer({})
.source(data, {
parser: {
type: 'json',
x: 'longitude',
y: 'latitude'
}
})
.shape('name', [
'cylinder',
'triangleColumn',
'hexagonColumn',
'squareColumn'
])
.size('unit_price', h => {
return [ 6, 6, h / 500];
})
.color('name', [ '#739DFF', '#61FCBF', '#FFDE74', '#FF896F' ])
.style({
opacity: 1.0
});
scene.addLayer(pointLayer);
})
}
public render() {
return (
<div
id="map"
style={{
position: 'absolute',
top: 0,
left: 0,
right: 0,
bottom: 0,
}}
/>
);
}
}