Как добавить PieCart через ObjectManager?

dsamoylov commented 4 years ago

Пытаюсь через доступ к ref'у использовать API карт и добавить piechart. Написал что-то странное, но как корректно вставить pie chart через оbject manager - непонятно :-/

Код компонента:

import React, { createRef } from "react";
import { YMaps, Map } from "react-yandex-maps";

const mapState = {
  center: [62.0, 105.0],
  zoom: 3,
};

function MyMap() {
  const mapRef: any = createRef();

  const setObjects = (ymaps: any) => {
    if (mapRef && mapRef.current) {
      var objectManager = new ymaps.ObjectManager();

      const myFeature = {
        type: "Feature",
        id: "MyFeature",
        geometry: {
          type: "Point",
          coordinates: [56.23, 34.79],
          preset: "islands#circleIcon",
        },
        properties: {
          data: [
            { weight: 8, color: "#0E4779" },
            { weight: 6, color: "#1E98FF" },
            { weight: 4, color: "#82CDFF" },
          ],
          iconCaption: "Диаграмма",
          iconLayout: "default#pieChart",
          iconPieChartRadius: 30,
          iconPieChartCoreRadius: 10,
          iconPieChartCoreFillStyle: "#ffffff",
          iconPieChartStrokeStyle: "#ffffff",
          iconPieChartStrokeWidth: 3,
          iconPieChartCaptionMaxWidth: 200,
        },
      };
      objectManager.add(myFeature);

      mapRef.current.geoObjects.add(objectManager);
    }
  };

  return (
    <YMaps>
      <div className="Map">
        <Map
          width="100%"
          height="95vh"
          instanceRef={mapRef}
          state={mapState}
          onLoad={(ymaps) => setObjects(ymaps)}
          modules={["ObjectManager"]}
        ></Map>
      </div>
    </YMaps>
  );
}

export default MyMap;

mmarkelov commented 4 years ago

@dsamoylov возможно вам поможет https://github.com/gribnoysup/react-yandex-maps/issues/219

dsamoylov commented 4 years ago

Спасибо, помогло! Я подозревал, что дело в загрузке модуля, но то, что он должен называться именно layout.PieChart - не нашёл нигде в документации. Имхо не помешал бы общий список модулей в документации.

gribnoysup commented 4 years ago

Модули в яндекс картах называются буквально так же как в документации яндекс карт

gribnoysup / react-yandex-maps

Как добавить PieCart через ObjectManager? #244