Can we make Y-Axis value draggable


#1

I wanted to drag y-axis values (through a check box or on it’s own) draggable, can we do that?

@Siarhei, may be you can help?


#2

Hello @ash0602 ,

If you mean the labels columns, there is no built-in way to make them draggable, but you can do it through js events:

// Drag part

/* events fired on the draggable target */
document.addEventListener("drag", function( event ) {
}, false);

document.addEventListener("dragstart", function( event ) {
  // store a ref. on the dragged elem
  dragged = event.target;
  // make it half transparent
  event.target.style.opacity = .5;
}, false);

document.addEventListener("dragend", function( event ) {
  // reset the transparency
  event.target.style.opacity = "";
}, false);

/* events fired on the drop targets */
document.addEventListener("dragover", function( event ) {
  // prevent default to allow drop
  event.preventDefault();
}, false);

document.addEventListener("dragenter", function( event ) {
  // highlight potential drop target when the draggable element enters i

}, false);

document.addEventListener("dragleave", function( event ) {
  // reset background of potential drop target when the draggable element leaves it
  if ( event.target.className == "timeline-label-div" ) {
    event.target.style.background = "";
  }
}, false);

document.addEventListener("drop", function( event ) {
  var action_data = scheduler.getActionData(event);
  if ( event.target.parentElement.classList.contains("dhx_matrix_cell")) {
    scheduler.addEvent({
      start_date: action_data.date,
      end_date:   scheduler.date.add(action_data.date, 3, "day"),
      text:   "Meeting",
      holder: "John",
      section_id:  action_data.section
    });
    scheduler.render()
  }

}, true);


Here is a demo:
https://snippet.dhtmlx.com/5/6680aa7cc