onaci / leaflet-velocity

Visualise velocity data on a leaflet layer
https://onaci.github.io/leaflet-velocity/
Other
598 stars 213 forks source link

No color on Black Sea map #114

Open GeoTuxMan opened 3 weeks ago

GeoTuxMan commented 3 weeks ago

I try to show currents from Black Sea on a map with streamlines. But all streamlines are same color and they are show on the land, not only on the sea. The map is here: https://syroco.rmri.ro/earth/index.html

The code from demo.js:

                                 `

                                              function initDemoMap() {
               var Esri_WorldImagery = L.tileLayer(
"http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}",
{
  attribution:
    "SYROCO 2024" +
    "....'"
}
         );

                     var Esri_DarkGreyCanvas = L.tileLayer(
"http://{s}.sm.mapstack.stamen.com/" +
  "(toner-lite,$fff[difference],$fff[@23],$fff[hsl-saturation@20])/" +
  "{z}/{x}/{y}.png",
{
  attribution:
    "SYROCO 2024" +
    "...'"
}
           );

    var baseLayers = {
    Satellite: Esri_WorldImagery,
    "Grey Canvas": Esri_DarkGreyCanvas
  };

        var map = L.map("map", {
         layers: [Esri_WorldImagery]
       });

        var layerControl = L.control.layers(baseLayers);
        layerControl.addTo(map);
         map.setView([43, 35], 7);

       return {
           map: map,
           layerControl: layerControl
  };
 }

        // demo map
       var mapStuff = initDemoMap();
      var map = mapStuff.map;
      var layerControl = mapStuff.layerControl;

      // load data (u, v grids)

         $.getJSON("blacksea.json", function(data) {
        var velocityLayer = L.velocityLayer({
        displayValues: true,
        displayOptions: {
        velocityType: "GBR Water",
        position: "bottomleft",
        emptyString: "No water data"
         },
        data: data,
  //minVelocity: -0.01,
      maxVelocity: 0.6,
      velocityScale: 0.6 // arbitrary default 0.005
      });

     layerControl.addOverlay(velocityLayer, "Black Sea Current - Romania");
    });

`

My current dataset: (blacksea.json) [{"header": {"parameterUnit":"m.s-1", "parameterNumber":2, "dx":1.0, "dy":1.0, "parameterNumberName":"U_component_of_current", "la1":80, "la2":-80, "parameterCategory":2, "lo2":379.66, "nx":83, "ny":141, "refTime":"2023-11-07 13:55:00", "lo1":20}, "data":[-0.04,-0.05,-0.05,.....] {"header": {"parameterUnit":"m.s-1", "parameterNumber":3, "dx":1.0, "dy":1.0, "parameterNumberName":"V_component_of_current", "la1":80, "la2":-80, "parameterCategory":2, "lo2":379.66, "nx":83, "ny":141, "refTime":"2023-11-07 13:55:00", "lo1":20}, "data":[....]