Skip to content

Instantly share code, notes, and snippets.

@kre1z0

kre1z0/yandex.js

Last active February 5, 2021 10:25
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save kre1z0/ead0f7506f05080dac568b10ac58d145 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save kre1z0/ead0f7506f05080dac568b10ac58d145 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. kre1z0 renamed this gist Feb 5, 2021. 1 changed file with 0 additions and 0 deletions.
    0 gistfile1.txt → yandex.js
    View file
    File renamed without changes.
  2. kre1z0 created this gist Feb 5, 2021.
    168 changes: 168 additions & 0 deletions gistfile1.txt
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,168 @@
    import { Component } from "react";
    import { geo } from "@evergis/sgis/es/Crs";
    import { throttle } from "lodash";

    import withEvergis from "HOC/withEvergis";

    import { script } from "./script";
    import { yandexContainerId } from "components/EvergisMap/TilesLayers/Yandex/yandexContainerId";
    import { yandexCopyrightsId } from "components/EvergisMap/Copyrights/copyrightId";

    class YandexBase extends Component {
    constructor(props) {
    const { locale, type } = props;

    super(props);
    this._type = this._getPossibleMapType(type);
    this._locale = locale;
    this._yandex = {};
    this.state = {
    isMounted: false,
    };
    }

    options = {
    minZoom: 0,
    maxZoom: 18,
    attribution: "",
    opacity: 1,
    };

    possibleShortMapTypes = {
    schemaMap: "map",
    satelliteMap: "satellite",
    hybridMap: "hybrid",
    publicMap: "publicMap",
    publicMapInHybridView: "publicMapHybrid",
    };

    componentDidMount() {
    const { map } = this.props;

    map.animationTime = 0;
    map.changeEndDelay = 0;

    map.on("bboxChange", this._update);
    this._init();
    this._update(true);
    }

    componentWillUnmount() {
    const { map } = this.props;

    const yandexMap = document.getElementById(yandexContainerId);

    if (yandexMap) {
    yandexMap.innerHTML = "";
    }

    const copyrights = document.getElementById(yandexCopyrightsId);

    if (copyrights) {
    copyrights.innerHTML = "";
    }

    map.animationTime = 300;
    map.changeEndDelay = 300;
    map.off("bboxChange", this._update);
    }

    _getPossibleMapType(mapType) {
    let result = "yandex#map";
    if (typeof mapType !== "string") {
    return result;
    }
    for (let key in this.possibleShortMapTypes) {
    if (mapType === this.possibleShortMapTypes[key]) {
    result = "yandex#" + mapType;
    break;
    }
    if (mapType === "yandex#" + this.possibleShortMapTypes[key]) {
    result = mapType;
    }
    }
    return result;
    }

    _init = () => {
    this.setState({ isMounted: true });
    this._initMapObject();
    };

    _initMapObject() {
    if (this._yandex[this._locale]) return;
    if (!window.ym) window.ym = {};

    if (!window.ym[this._locale]) {
    return script(`//api-maps.yandex.ru/2.1.78/?load=package.map&lang=${this._locale}`).then(
    () => {
    window.ym[this._locale] = global.ymaps;
    this._initMapObject();
    },
    );
    }

    // Check that ymaps.Map is ready
    if (ym[this._locale].Map === undefined) {
    return ym[this._locale].load(["package.map"], this._initMapObject, this);
    }

    //Creating ymaps map-object without any default controls on it
    const yandexMap = new ym[this._locale].Map(document.getElementById(yandexContainerId), {
    center: [0, 0],
    zoom: 0,
    behaviors: [],
    controls: [],
    });

    if (this._type === "yandex#null") {
    this._type = new ym[this._locale].MapType("null", []);
    yandexMap.container.getElement().style.background = "transparent";
    }
    yandexMap.setType(this._type);

    this._yandex[this._locale] = yandexMap;
    this._update(true);
    this.setCopyrights();
    }

    setCopyrights = () => {
    const yandexMap = this._yandex[this._locale];
    const yandexCopyrights = yandexMap.copyrights._layout._parentElement;
    const copyrights = document.getElementById(yandexCopyrightsId);

    copyrights.appendChild(yandexCopyrights);
    };

    getZoom = () => {
    const { map } = this.props;

    const index = map.tileScheme.getLevel(map.resolution);

    if (index === void 0 && index === null) return;

    return map.tileScheme.levels[index].zIndex;
    };

    _update = throttle((force) => {
    const { map } = this.props;
    const yandexMap = this._yandex[this._locale];

    if (!yandexMap || !map) return;

    const zoom = this.getZoom();
    const center = map.centerPoint.projectTo(geo).position;

    yandexMap.setCenter(center);

    if (force || yandexMap.getZoom() !== zoom) {
    yandexMap.setZoom(zoom);
    }
    }, 14);

    render() {
    return null;
    }
    }

    export const Yandex = withEvergis(YandexBase);