Юре

Yandexmap.js

////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//
//  Copyright (C) 2008-2016 Quantron Systems LLC.
//  All Rights Reserved.
//
//  This file is part of the Pakmil project.
//  For conditions of distribution and use,
//  please contact sales@quantron-systems.com
//
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
import React from 'react';
import styles from './styles.css';
import CSSModules from 'react-css-modules';

/* global ymaps */

////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
const Yandexmap = React.createClass({
    propTypes(){
        return {
            lat: React.PropTypes.number,
            lng: React.PropTypes.number,
            id: React.PropTypes.string,
            mark: React.PropTypes.string
        };
    },
    getDefaultProps(){
        return {
            lat: null,
            lng: null,
            id: null,
            mark: null
        };
    },
    getInitialState(){
        return {
            mapRendered: false
        };
    },
    componentDidMount(){
        const {lat, lng, id, mark} = this.props;
        const init = () => {
            const yandexMap = new ymaps.Map(id, {
                center: [lat, lng],
                zoom: 12,
                controls: ['largeMapDefaultSet']
            });

            yandexMap.geoObjects.add(new ymaps.Placemark([lat, lng], {
                iconCaption: mark
            }, {
                preset: 'islands#redDotIconWithCaption'
            }));
        };

        ymaps.ready(init);
    },
    render(){
        return (
            <div styleName='map' id={this.props.id}/>
        );
    }
});

////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
export default CSSModules(Yandexmap, styles);