Svelte Mapbox-gl-draw:如何获得父组件的多边形坐标？_如何判断Svelte组件的属性是否已被父组件更改？_如何在父组件中获得渲染的子组件？ - 腾讯云开发者社区

Svelte是一种现代的JavaScript框架，用于构建用户界面。Mapbox-gl-draw是一个用于在地图上绘制和编辑几何图形的库。在Svelte中，要获得父组件的多边形坐标，可以通过以下步骤实现：

在父组件中，首先引入Mapbox-gl-draw库和相关的依赖项。可以使用npm或其他包管理工具进行安装。
在父组件的JavaScript部分，创建一个地图实例，并将Mapbox-gl-draw库与地图实例关联起来。可以使用Mapbox的API密钥来初始化地图。
在父组件的模板部分，使用Mapbox-gl-draw提供的组件或指令来渲染地图和绘制工具。
在父组件的JavaScript部分，使用Svelte的事件系统来监听Mapbox-gl-draw库中的绘制事件。例如，可以监听绘制完成事件，以获取绘制的多边形坐标。
当绘制完成事件触发时，可以在事件处理程序中获取绘制的多边形坐标，并将其存储在父组件的数据中，以便在需要时进行使用或传递给其他组件。

以下是一个示例代码，演示了如何在Svelte中获取父组件的多边形坐标：

<script>
  import { onMount } from 'svelte';
  import mapboxgl from 'mapbox-gl';
  import MapboxDraw from '@mapbox/mapbox-gl-draw';

  let map;
  let draw;

  onMount(() => {
    mapboxgl.accessToken = 'YOUR_MAPBOX_ACCESS_TOKEN';
    map = new mapboxgl.Map({
      container: 'map',
      style: 'mapbox://styles/mapbox/streets-v11',
      center: [-74.5, 40],
      zoom: 9
    });

    draw = new MapboxDraw();
    map.addControl(draw);

    map.on('draw.create', handleDrawCreate);
  });

  function handleDrawCreate(event) {
    const { features } = event;
    const polygonCoordinates = features[0].geometry.coordinates;
    // 将多边形坐标存储在父组件的数据中
  }
</script>

<div id="map" style="width: 100%; height: 400px;"></div>

在上述示例代码中，通过监听draw.create事件，可以在handleDrawCreate函数中获取绘制的多边形坐标，并将其存储在父组件的数据中。

对于Svelte和Mapbox-gl-draw的更详细信息和用法，请参考以下链接：