Necesito implementar la función de arrastre para los echarts.

CÓDIGO HTML:

 <div class="maindash"> <div class="cardchart" id="barchart" ></div> <div class="cardchart" id="piechart" ></div> <div class="cardchart" id="areachart" ></div> <div class="cardchart" id="baranimchart" ></div> </div> <style> .maindash { display: flex; flex-wrap: wrap; justify-content: space-evenly; flex-grow: 0; margin: 10px; gap: 5px; overflow: auto; height: 100%; } .cardchart { box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); margin:13px; width: 400px; height: 300px; background-color: #fff; } </style>

CÓDIGO JS:

 function dragndrop() { $( ".cardchart" ).sortable({ revert: true }); }

Por alguna razón, solo puedo arrastrar el gráfico y no el div. He seleccionado (.cardchart) pero continúa arrastrando solo el gráfico. Yo quiero arrastrar el div completo.