Actualmente estoy tratando de implementar una función de zoom que sea ligeramente diferente de la que ya existe.
En realidad, me gustaría que si un usuario hace clic y arrastre en el gráfico, amplía el dominio así definido. Me gustaría hacerlo de esa manera porque con la rueda del mouse evita que el usuario suba / baje la página.

Como no parece posible con elC3.js API, Intenté implementar el evento drag siguiendo este pequeño tutorial en D3.jsComportamiento de arrastre. Sin embargo, no lo entendí bien, ya que no funciona cuando lo intento en el gráfico.

Aquí hay una muestra de mi código:

function setHandlers() {
    /**
     * A custom drag event  to zoom on the graph
     */

    var drag = d3.behavior.drag();
    d3.selectAll('.c3-event-rects').on(".drag", null);

    drag
        .on('dragstart', function (d) {
            d3.event.sourceEvent.stopPropagation();
            console.log("start");
            console.log(d)
        })
        .on('drag', function (d) {
            console.log("on bouge :)")           
        })
        .on('dragend', function (d) {
            console.log("end");
            console.log(d)
         })
}

Llamo a esta función cada vez que actualizo mi gráfico y ya he codificado un controlador personalizado para un doble clic (en la misma función, pero lo tengo desactivado para que quede más claro). Me gustaría saber cómo activar con éxito un evento de arrastre en un gráfico C3.js, especialmente los eventos dragstart y dragend.

Muchas gracias por sus respuestas