I need a HTML5 / JavaScript Canvas based drag and drop football pitch designer

We need a layout builder similar to https://this11.com/#!/editor/ but landscape format pitch

We would need the option to change the background (pitches) multiple designs say 10 as a rough estimate. These have been designed

Player Icons:
Think we will have small circles like the bottom video link - 3 different colours

List of Equipment
- Footballs
- Small Cones
- Traffic Cones
- Ladder
- Hurdles
- Poles
- Goals Large and Small (need to create our own)
- Mannequins

Arrows
- Straight
- Straight dashed
- wavy straight
- wavy dashed
- arc

Need a Text Option to drag onto and type

some similar examples:
https://www.soccer-profile.com/coaches/#coaches-session-diagrams
https://www.youtube.com/watch?v=thxu7L9RDiY
https://www.youtube.com/watch?v=GeByVA_3qn4

The solution should be embeddable within WordPress somehow, iframe or integrated into a Plugin, I am a WordPress developer so we can work together on this.