vasturiano / three-globe

WebGL Globe Data Visualization as a ThreeJS reusable 3D object
https://vasturiano.github.io/three-globe/example/links/
MIT License
1.26k stars 150 forks source link

Different colors for paths using pathsData and pathColor #98

Open alinamurvay opened 4 days ago

alinamurvay commented 4 days ago

I need to display 2 mobile earth terminals, and a moving satellite, and the paths between each terminals and the satellite, having the positions(lat, lng and alt(for satellite). I am trying to use pathsData, but I am unable to set different colors for the trajectories of each terminal/satellite and the paths between each terminal and the satellite. Is there any way to do this? Thank you!

Globe.pathsData([ terminal1Coords, terminal2Coords, satelliteCoords, ...terminal1ToSatellitePaths, ...terminal2ToSatellitePaths, ]) .pathColor(() => "red") .pathResolution(4) // Solid lines .pathDashLength(1) .pathDashGap(0) .pathTransitionDuration(satelliteCoords.length * 100);

vasturiano commented 4 days ago

@alinamurvay the pathColor method takes a path attribute that you can use to specify different colors for the various paths. So, something like

.pathColor(path => {
  return getPathColor(path); // the implementation of this function is up to you
});