Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

🤔 [QUESTION] 似乎没有完全支持L7Plot的raster部分 #167

Closed
Euraxluo opened this issue Apr 19, 2023 · 8 comments
Closed

🤔 [QUESTION] 似乎没有完全支持L7Plot的raster部分 #167

Euraxluo opened this issue Apr 19, 2023 · 8 comments

Comments

@Euraxluo
Copy link

🐛 Question description [Please make everyone to understand it]

感谢LarkMap,但是看起来似乎没有完全支持L7的raster部分。
请告诉我怎么做才能实现呢,这个很重要,可以使用L7内部的转换代码将各种数据转换为栅格后传给LarkMap吗

💻 Link to minimal reproduction

source code:

import AMapLoader from '@amap/amap-jsapi-loader';
import { LarkMap, RasterLayer, RasterLayerProps } from '@antv/larkmap';
import React, { useState } from 'react';
import { GaodeMap } from '@antv/l7';

const rasterLayerOptions: Omit<RasterLayerProps, 'source'> = {
    autoFit: true,
    style: {
        opacity: 0.8,
        domain: [0, 2000],
        rampColors: {
            colors: ['#FF4818', '#F7B74A', '#FFF598', '#91EABC', '#2EA9A1', '#206C7C'].reverse(),
            positions: [0, 0.2, 0.4, 0.6, 0.8, 1.0],
        },
    },
};
const getMapInstance = () => {
    return AMapLoader.load({
        key: '089b120ae9421928984329b9ecec8eba', // 申请好的 Web 端开发者Key,首次调用 load 时必填
        version: '2.0', // 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15
        plugins: [], // 需要使用的的插件列表,如比例尺'AMap.Scale'等
    }).then((AMap) => {
        return new GaodeMap({
            mapInstance: new AMap.Map('container', {
                zoom: 12, //初始化地图层级
                center: [116.397428, 39.90923], //初始化地图中心点
            }),
        });
    });
};
export default function Map() {
    const [rasterOptions, setRasterOptions] = useState(rasterLayerOptions);
    const [rasterSource, setRasterSource] = useState({
        data: {
            type: "FeatureCollection",
            features: [
                {
                    type: "Feature",
                    geometry: { type: "Point", coordinates: [104.101, 30.649] },
                    properties: { name: "chengdu" },
                },
            ],
        },
        parser: { type: 'geojson' },
        raster: {
            cellSize: 0.002, // 20cm对应的经纬度大小,这个值会因地区和投影方式而略有差异
        },
        transforms: [
            {
                type: 'grid',
                size: 15000,
                field: 't',
                method: 'sum',
            }
        ]
    });
    return (
        <LarkMap
            id="container"
            map={getMapInstance}
            className="h-9/10"
        >
            <RasterLayer {...rasterOptions} source={rasterSource} />
        </LarkMap>
    );
}

image
image

Please provide a link by forking these links LarkMap or GitHub repo. What is a minimal reproduction, and why is it required?

🏞 Expected result

预期:正常运行

🚑 Any additional [like screenshots]

  • LarkMap Version:
    "@antv/l7": "^2.15.2",
    "@antv/l7-draw": "^3.0.20",
    "@antv/larkmap": "^1.3.5",
  • Platform:
    windows
@lzxue
Copy link
Contributor

lzxue commented Apr 19, 2023

https://larkmap.antv.antgroup.com/components/layers/base-layers/raster-layer 这个不行吗

@Euraxluo
Copy link
Author

https://larkmap.antv.antgroup.com/components/layers/base-layers/raster-layer
larkMap官网示例是跑通的,我现在想要实现L7的一些别的功能:https://l7plot.antv.antgroup.com/api/source
主要需求是看能不能直接渲染geojson到栅格

@lzxue
Copy link
Contributor

lzxue commented Apr 19, 2023

栅格图层只支栅格数据

@Euraxluo
Copy link
Author

所以不支持吗

@Euraxluo
Copy link
Author

那么L7plot的source和LarkMap的RasterLayer的source其实不是一样的嘛

@lzxue
Copy link
Contributor

lzxue commented Apr 19, 2023

Raste图层r只支持 Raster 数据,这个肯定不一样的。L7也不行

@Euraxluo Euraxluo changed the title 🤔 [QUESTION] 似乎没有完全支持L7的raster部分 🤔 [QUESTION] 似乎没有完全支持L7Plot的raster部分 Apr 19, 2023
@Euraxluo
Copy link
Author

我以为可以支持L7plot的那种使用方式

@lzxue
Copy link
Contributor

lzxue commented Apr 19, 2023

可以写啊,但是也是按照raster 去写

{
...prevState,
data: tiffData.data,
parser: {
type: 'raster',
width: tiffData.width,
height: tiffData.height,
min: 0,
max: 80,
extent: [73.482190241, 3.82501784112, 135.106618732, 57.6300459963],
},
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants