JSFiddle - React, Tailwind, and code Playground

by vavi

HTML

<div id="map"></div>

CSS

</style>
 <script src="//api-maps.yandex.ru/2.1/?lang=ru_RU" type="text/javascript"></script>
<style>
        body, html {
            padding: 0;
            margin: 0;
            width: 100%;
            height: 100%;
        }
        #map {
            width: 100%;
            height: 100%;
        }
.flat-point{
    width:10px;
    height:10px;
    display:block;
    background-color:red;
}

JavaScript

ymaps.ready(init);

function init() {
    var myMap = new ymaps.Map('map', {
            center: [55.76,37.64],
            zoom: 11,
            controls: ['zoomControl']
        });
//referencePoints: ['55.712928,37.691306','55.697884,37.665992','55.697884,37.665992'],       
var myMultiRoute = new ymaps.multiRouter.MultiRoute({
     referencePoints: [
  '55.726386,37.636051',
'55.710661,37.599301',
'55.740629,37.617159',
'55.737456,37.642608',
'55.750616,37.650864',
'55.739306,37.640282',
'55.747596,37.627562',
'55.733614,37.637802',
'55.733614,37.637802',
'55.733726,37.637263',
'55.738748,37.627166',
'55.738748,37.627166',
'55.722451,37.636257',
'55.721838,37.628676',
'55.721721,37.624948',
'55.719384,37.626645',
'55.744404,37.639374',
'55.744404,37.639374',
'55.743634,37.640488',
'55.743634,37.640488',
'55.739914,37.643129',
'55.743679,37.610233',
'55.738885,37.612802',
'55.740958,37.615821',
'55.725904,37.647567',
'55.725904,37.647567',
'55.715418,37.646013',
'55.713207,37.646714',
'55.708759,37.645761',
'55.708744,37.61477',
'55.705676,37.611796',
'55.70388,37.594297',
'55.705752,37.598842',
'55.70669,37.599525',
'55.70669,37.599525',
'55.72559,37.608706',
'55.711574,37.587407',
'55.712604,37.577597',
'55.693591,37.532439',
'55.688862,37.540668',
'55.692206,37.545986',
'55.717538,37.597585',
'55.730421,37.634793',
'55.699132,37.624373',
'55.733082,37.64365',
'55.722294,37.621534',
'55.740892,37.630239',
'55.768659,37.63941'   
     
     ],
params: {
        results: 2
        }
                                                    },
        {
        boundsAutoApply: true
        }
                                                    );
   
    
var route_button = new ymaps.control.Button({
data: { content: 'Посчитать'}});
myMap.controls.add(route_button);
    
route_button.events.add('select', function () 
                                            { 
var duration_text=myMultiRoute.getActiveRoute().properties.get('duration.text');
var...