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

Is it possible to have animations with canvas ? #149

Open
1 task done
kamilcglr opened this issue Apr 28, 2021 · 0 comments
Open
1 task done

Is it possible to have animations with canvas ? #149

kamilcglr opened this issue Apr 28, 2021 · 0 comments

Comments

@kamilcglr
Copy link

kamilcglr commented Apr 28, 2021

Type:

  • question

Description:
Hello, I would like to animate several paths on my map. So it seems the performance are better with canvas.

However, when I put a custom renderer, the paths are displayed but the animation does not work anymore.

I set the preferCanvas option to true for the map.

this.$refs.sensorMap.mapObject.createPane('customPane')
this.canvasRenderer = this.$L.canvas({ pane: 'customPane' })

const antPolyline = this.$L.polyline.antPath(
          [
            'M',
            [this.originLatitude, this.originLongitude],
            'Q',
            midpointLatLng,
            [latitude, longitude],
          ],
          {
            use: this.$L.curve,
            delay: 500,
            dashArray: [50, 10],
            weight: this.getWeight(item.data),
            color: this.getColor(item.dir),
            pulseColor: '#FFFFFF',
            hardwareAcceleration: true,
            interactive: false,
            reverse: item.dir === 'IN',
            renderer: this.canvasRenderer, <= this option breaks animations
          }
        )

The lines are drawn but the animations do not work anymore. Is it possible to have the animations using a canvas renderer?
Thank you in advance

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

1 participant