Comments (3)
Work in progress: http://pol-dev.be/heatmap/
I'm struggling to find a way to make the grid pan correctly, any help is welcome.
from heatmap.js.
I think this can be easily done by extending heatmap.js' drawAlpha function + reducing datapoint accuracy (probably has to be done in the heatmap-openlayers implementation).
I wrote a small article about getting rid of too much datapoints by reducing accuracy, probably helpful:
http://www.patrick-wied.at/blog/data-clustering-for-a-multiuser-website-heatmap
you would have to get rid of the radial gradients (in drawAlpha), just set the opacity fillstyle and the fillRect should make it
from heatmap.js.
No, I think the problem is more complicated (or maybe I don't get your explanations ?).
Let's stay that we want to divide the canvas by square of 20px width.
We need to find the 'distribution' of all the features into this grid.
The distribution means for me:
At row 1, column 3, we have 3 features.
At row 3, column 7, we heave 8 features,
etc etc etc
Then, once the distribution is done, we have to colorize the squares and set the right opacity according to the number of features into it.
I'm almost there with the demonstration up there, it's just that I can't find a way to make the grid pan with the layer behind it and I cannot cover the whole canvas with the grid (only when panning).
It looks easy but I don't think it is.
That kind of grid could be very helpful because it would requires less CPU, and that's interesting ! And the result is also very nice.
I'm looking forward for your reply.
from heatmap.js.
Related Issues (20)
- 'TypeError: offset required' when using Heatmap.js with local tests HOT 1
- Blur disappears after seconds
- 如何清空渲染的数据 HOT 3
- Make datapoint disapear after some time? HOT 1
- TypeError: Failed to execute 'getComputedStyle' on 'Window': parameter 1 is not of type 'Element HOT 1
- All points whose radii overlap the view should be rendered
- Loaded longitude and latitude HOT 4
- setData bug HOT 1
- I issued this by mistake, please remove it.
- How to use in a backend Node JS environment? HOT 1
- leaflet heatmap - crash when zoom out
- Issue when set value 0 for dataPoints
- heatmap issue on certain phones/browsers
- Cannot remove the heatmap layer HOT 1
- setData problem in chrome
- How to use Heatmap Animation Example? HOT 1
- How to avoid the warning about Canvas2D in the browser's console
- img.data is read-only, and assigning to it throws a TypeError in strict mode HOT 1
- ImageData data assignment in Strict Mode 2.0.5 HOT 1
- Is this project still alive? HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from heatmap.js.