move two layers together with jcanvas

Question

using jcanvas, how do i link two draggable layers such that they move together.
enter image description here
eg. the circle and document icon are two diff layers. how do i have them
a) draw on the same layer or
b) move together

  // document
      .drawArc({
      layer: true,
      groups: ['document'],
      fillStyle: 'yellow',
      x: 100, y: 250,
      radius: 50
      })

      .drawImage({
      groups: ['document'],
      source: "img/document.jpg",
      x: 100, y: 250,
      width:40, height: 40,
      layer: true
    })


    $('canvas').setLayerGroup('document', {
      draggable: true,
      bringToFront: true
    })

my solution was to use svg images instead of drawing the parts separately. perhaps someone else can suggest an answer to the question. the documentation doesnt make this use case clear. — jsky, May 25 '15 at 07:02

score 0 · Answer 1 · answered Jun 12 '15 at 09:37

You can do it using dragGroups:[]

Code here

    $('canvas').drawArc({
            layer: true,
            groups: ['document'],
            dragGroups: ['document'],
            draggable: true,
            fillStyle: 'yellow',
            x: 100, y: 250,
            radius: 50
        })

        .drawImage({
            groups: ['document'],
            dragGroups: ['document'],
            draggable: true,
            source: "img/document.jpg",
            x: 100, y: 250,
            width: 40, height: 40,
            layer: true
        }).drawLayers();

move two layers together with jcanvas

1 Answers1