Openseadragonfillter CONVOLUTION grid line issue

[PpyMohan]

After Adding CONVOLUTION Openseadragonfillter i am getting grid lines on image how to hide this grid lines ??
And it is clearly visible when i zoom image

[iangilman]

Yes, that's a known issue with this plugin. See the "Edge Effects" note at the bottom here: https://github.com/usnistgov/OpenSeadragonFiltering#edge-effects Also see #4.

Of course it would be great to fix! The challenge is that this filter operates on each tile individually, and the tiles don't have access to the pixels of their neighbors' edges. A couple possible strategies come to mind:

• Figure out how to correlate the tiles with each other so the edges of other tiles can be included in the calculation. This could either be done ad hoc, so the calculation happens across canvases, or we could have another offscreen canvas where we lay the tiles out together for the purpose of running the convolution and then copy the results back into the individual tiles.
• Don't run the convolution on the tiles at all, but run it instead on the viewer's canvas when it updates.

Of these approaches, I imagine the offscreen canvas would be the best performance, but it would also require the most memory.

One trade-off to be aware of is if you run the convolution on the tiles, its scale changes as you zoom (and again as each tile layer is revealed), whereas if you run it on the viewer's canvas, the convolution scale remains that of the canvas regardless of how you zoom. Which result is more appealing depends on the application.

[PpyMohan]

Is that possible to remove that grid line ??

[iangilman]

It would take a bunch of development work; it's not easy. My suggestions for how to do that work are in the comment above.

[rmd13]

It would take a bunch of development work; it's not easy. My suggestions for how to do that work are in the comment above.

Hi,
Is the current filter run on the viewer's canvas, or on the source tiles? I encountered problems that if I load too many filters and drag the canvas too fast, then some black square appeared and cannot be filled no matter how I change the filter, zoom or drag the canvas. From this bug and the source code of context.getImageData, it seems that the the filter was run on the viewer's canvas. Thus if a blask square was not filled before the execution of getImageData, that black square will be treated as pixels and undergo following image filtering and make it black forever. Am I right?

If so, what might be the source of black square? I though it woule be the syn/asyn problems. To solve this problem, I change all the demo.js and demo-bundle.js source code to make all the statement of asyn converted to syn, then I found that the filtering was slower and less responsive, but the black square problem improved a lot.

However, there is still ocasional black square, although much less than before. I though this problem is also dependent on on the CPU speed and Graphic card. Better CPU and GPU can solve it. Am I right?

Thanks.

[iangilman]

I believe the filter is run on each tile's canvas (each tile has its own canvas that the original tile image is copied to for performance reasons), not the viewer's canvas.

It's hard to say where these black squares are coming from. Someone might be able to take a look at it if you post a demo of it in action (on CodePen or some such).

[rmd13]

The black square problem is not easy to reproduce because the code is under nomal code. It is just that when I zoom and drag to fast, then black square sometimes appear. I use the same js code as the filter demo website. The only difference is that the code is not run on a server, but run locally by open html files in IE and enable the blocked danger. Chrome cannot display the image on the html
content.

[iangilman]

Have you tried running your code on a local server rather than just opening the file? That should help with Chrome displaying the image, I believe.

[18073479643]

May I ask whether the grid line problem has been solved? This problem is very important to me

[iangilman]

Not that I'm aware of. You're welcome to work on a fix if you'd like.

What's your scenario? Perhaps there are workarounds…

[18073479643]

I used caman.js sharpening and the resulting picture had grid lines

[18073479643]

I think it was caused by the sharpening of the tiles, which sharpened the edges of the tiles. After the tiles were joined together, there were very obvious gaps

[18073479643]

If I don't describe my problem clearly, can I send you an email to further describe the problem

[iangilman]

Makes sense; that's a classic case of the issue discussed here. The true fix would be the code improvements mentioned near the top of this thread.

If you wanted to try to hack around it, one possibility would be to not use this plugin, but instead run a sharpen filter directly on the OpenSeadragon canvas after every time it draws. I have no idea if that would look good or perform well, but it's something to try.

Of course, another option would be to sharpen your image on the server before converting it into tiles.

[18073479643]

I have tried the method you mentioned, but it doesn't work and will end in failure. After dragging the OpenSeadragon canvas, the sharpening effect will be lost, which I think is the result of creating a new canvas while dragging. If you loop through the sharpening effect, this will cause the page to get stuck, and there are many problems with using this method that I won't list