14

Line style in leaflet always are solid ,I want the line to be -1)Dashed line style -2)Train line style

  var L2 = new L.geoJson(L2, {
  style: function(feature) {
    return {
      color: 'black',
      weight: 7
    };
  },
  onEachFeature: function(feature, layer) {
    layer.on({
      'mousemove': function(e) {
        e.target.setStyle({
          weight: 7,
          color: 'red'
        });

      },
      'mouseout': function(e) {
        L2.resetStyle(e.target);
      },
      'click': function(e) {
        mymap.fitBounds(e.target.getBounds());
        L2.bindPopup("<b>" + feature.properties.Nom);
      }
    });
  }
}).addTo(mymap);

Here is my code result

2 Answers 2

9

This is an example of a polyline formatted as train track / railway road. Three polylines are drawn on top of each other using dashArray.

plTrainPost[0] = L.polyline(latlonPost, {color: 'black', weight: '5'});
plTrainPost[1] = L.polyline(latlonPost, {color: 'black', weight: '3',  dashArray: '20, 20', dashOffset: '0'});
plTrainPost[2] = L.polyline(latlonPost, {color: 'white', weight: '3', dashArray: '20, 20', dashOffset: '20'});
var CPrePostLayer = L.layerGroup(plTrainPost[0], plTrainPost[1], plTrainPost[2]]);
var overlayMaps = {"An-/Rückfahrt": CPrePostLayer};
L.control.layers(baseMaps, overlayMaps).addTo(mymap);

If you want the track to appear in black only, you will not need plTrainPost[1]. Otherwise select the color of that polyline.

7

Have you noticed the dashArray option for your vector layers?

Forked Plunker: http://plnkr.co/edit/KyHOkjytDJf1QjCO0Nyh?p=preview

As for the "Train line style", that would depend on what you mean, but if it involves more than 1 color, you would probably need some workaround (duplicate your line…)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.