Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Intensity doesn't affect gradient #131

Open
FrankieDuck opened this issue Jul 7, 2023 · 2 comments
Open

Intensity doesn't affect gradient #131

FrankieDuck opened this issue Jul 7, 2023 · 2 comments

Comments

@FrankieDuck
Copy link

FrankieDuck commented Jul 7, 2023

Hello,

I have been working with this package and from my understanding the intensity doesn't affect the gradient? What does seem to affect the gradient is how close a point is to other points, that also changes depending on zoom level. So a cluster of points will have a higher intense gradient.

Is there anyway to directly use the intensity value to control the gradient that is passed to the heat layer? I want to represent points with higher values as a darker colour as opposed to lower values with a lighter gradient. With the current functionality a point with an intensity value of 0.77 would have the same colour as one with 0.22.

So, instead of a heatmap based on coordinates proximity to each other, I want it to be affected by the strength value of each coordinate.

thank you any help!

an example of my array would be like this:
[60300, 86220, 0.67],
[64122, 85670, 0.23]

~code below

const HeatmapComponent = ({ heatMapData }) => {
  const map = useMap()

  useEffect(() => {
    const points = heatMapData ?.map((data) => {
      const lat = data[0][0]
      const lng = data[0][1]
      const str = data[0][2]

      return [lat, lng, str]
    })

    const heatLayer = L.heatLayer(points, {
      minOpacity: 0.5,
      maxZoom: map.getMaxZoom(),
      max: 1.0,
      radius: 15,
      blur: 15,
    }).addTo(map)

    return () => {
      map.removeLayer(heatLayer)
    }
  }, [heatmapCords, map])
@patrykluczak
Copy link

I have exact same problem. However I think it works based on intensity but it also groups those values together based on radius and when you zoom in/out it changes and usually looks really bad...

@jlarminay
Copy link

Not sure if this will work for you, but I modified the code slightly to fit my use case.

In the file dist/leaflet-heat.js, I updated the _redraw function to use intensity directly instead of calculating it based on the zoom level.

Specifically, I changed this code on line 11 (the entire function is on this line):

;r=x*f,

to:

;r=this._latlngs[t][2],

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants