Раскраска частей мультимаршрута

220

05 декабря 2017, 23:03

Как раскрасить части мультимаршрута? От точки A до B один цвет, а от точки B до C другой.

ymaps.ready(init); 
 
function init() { 
  var myMap; 
  var path_from = 'Киров, Ленина, 80'; 
  var path_to = 'Киров, Воровского, 135'; 
 
  myMap = new ymaps.Map('map', { 
    center: [58.599191, 49.648409], 
    zoom: 12, 
    controls: [] 
  }, { 
    buttonMaxWidth: 300 
  }); 
 
  var trafficControl = new ymaps.control.TrafficControl({ 
    state: { 
      providerKey: 'traffic#actual', 
      trafficShown: false 
    } 
  }); 
  myMap.controls.add(trafficControl); 
  trafficControl.getProvider('traffic#actual').state.set('infoLayerShown', true); 
 
  var multiRoute = new ymaps.multiRouter.MultiRoute({ 
    referencePoints: [ 
      'Россия, Кировская область, ' + path_from, 
      'Россия, Кировская область, ' + path_to, 
      'Россия, Кировская область, ' + path_from, 
    ], 
    params: { 
      results: 1, 
      avoidTrafficJams: true 
    } 
  }, { 
    boundsAutoApply: true 
  }); 
 
  myMap.geoObjects.removeAll(); 
  myMap.geoObjects.add(multiRoute); 
 
  multiRoute.model.events.add("requestsuccess", function(event) { 
    multiRoute.getRoutes().each(function (route) { 
      console.log('route data:', route.properties.getAll()); 
      route.getPaths().each(function (path) { 
        console.log('path data:', path.properties.getAll()); 
      }); 
    }); 
  }); 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script src="https://api-maps.yandex.ru/2.1/?lang=ru_RU"></script> 
<div id="map" style="width: 93vw; height: 95vh"></div>

Answer 1

Получилось как-то так... Есть что улучшить (сократить)?

ymaps.ready(init); 
 
function init() { 
  var myMap; 
  var path_from = 'Киров, Ленина, 80'; 
  var path_to = 'Киров, Воровского, 135'; 
 
  myMap = new ymaps.Map('map', { 
    center: [58.599191, 49.648409], 
    zoom: 12, 
    controls: [] 
  }, { 
    buttonMaxWidth: 300 
  }); 
 
  var trafficControl = new ymaps.control.TrafficControl({ 
    state: { 
      providerKey: 'traffic#actual', 
      trafficShown: false 
    } 
  }); 
  myMap.controls.add(trafficControl); 
  trafficControl.getProvider('traffic#actual').state.set('infoLayerShown', true); 
 
  var multiRoute = new ymaps.multiRouter.MultiRoute({ 
    referencePoints: [ 
      'Россия, Кировская область, ' + path_from, 
      'Россия, Кировская область, ' + path_to, 
      'Россия, Кировская область, ' + path_from, 
    ], 
    params: { 
      results: 1, 
      avoidTrafficJams: true 
    } 
  }, { 
    boundsAutoApply: true, 
    opacity: 0.9 
  }); 
 
  myMap.geoObjects.removeAll(); 
  myMap.geoObjects.add(multiRoute); 
 
  multiRoute.model.events.add("requestsuccess", function(event) { 
 
    multiRoute.getRoutes().each(function (route) { 
      route.getPaths().each(function (path) { 
        var index = path.properties.get('index'); 
        path.getSegments().each(function (segment) { 
         switch (index) { 
           case 0: 
             segment.options.set({ strokeColor: '#FF0000' }); 
             break; 
           case 1: 
             segment.options.set({ strokeColor: '#00FF00' }); 
             break; 
           default: 
             segment.options.set({ strokeColor: '#0000FF' }); 
         } 
        }); 
      }); 
    }); 
  }); 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script src="https://api-maps.yandex.ru/2.1/?lang=ru_RU"></script> 
<div id="map" style="width: 93vw; height: 95vh"></div>