Published
Edited
Apr 21, 2020
5 stars
Insert cell
Insert cell
Insert cell
Insert cell
{
const child = {
id: 'draggble',
draggable: true,
class: "child",
ondragstart: e => e.target.classList.add("dragging"),
ondragend: e => e.target.classList.remove("dragging")
};

const parent = {
class: "parent",
ondrop: e => {
e.target.classList.remove('dragover');
e.target.appendChild(document.getElementById('draggble'));
},
ondragenter: e => e.target.classList.add("dragover"),
ondragleave: e => e.target.classList.remove("dragover"),
ondragover: e => e.preventDefault()
};

return render([
'div',
{ class: "main" },
[["div", parent, ["div", child]], ["div", parent]]
]);
}
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more