how to make click and then grid click

[ampwi...@gmail.com]

So I need to make it so that you can click a point and then click the grid and then  move that point to the selected grid point. Anyone got a straightforward way to do this? (And it has to be ok to click the "white space" between the lines... not just the lines.)

Thanks!

-Colin

[Alfred Wassermann]

Dear Colin,

interesting challenge! This could be a starter:

        const board = JXG.JSXGraph.initBoard('jxgbox', {
            boundingbox: [-5, 5, 5, -5], axis: true
        });

        var clicks = [];
        var A = board.create('point', [2, 2]);
        var B = board.create('point', [2, -2]);

        board.on('click', function (evt) {
            // Get all elements under mouse pointer + position
            let list = this.getAllUnderMouse(evt);

            if (clicks.length === 0) {
                // Add point
                if (list.length > 1 && JXG.isPoint(list[0])) {
                    clicks.push(list[0]);
                    list[0].setAttribute({ color: JXG.palette.blue });
                }
            } else {
                // Point has been selected, now get the
                // new position for the point
                if (list.length === 1) {
                    let pos = list[0];
                    let point = clicks[0];

                    point.moveTo(
                        [Math.round(pos[0]), Math.round(pos[1])],
                        500,
                        {
                            callback: function () {
                                point.setAttribute({ color: JXG.palette.red });
                            }
                        }
                    );
                    clicks = [];
                }
            }
        });

See it live at https://jsfiddle.net/u85gtvx4/1/

Best wishes, Alfred

[ampwi...@gmail.com]

This was actually really helpful. Especially when I changed the listener I was using for the board to listen for the correct event (doh). So thanks for the direction! The only issue I had was that when I clicked on the axis or the tic numbers, they of course add to the array of objects under the list. so the length would be more than 1. I did a sort of lookup and just checked to see if the returned item in the list was an array (for the positioning). I also returned out if it was another point (as they shouldn't be placing points on points in this particular graph. 

Alfred, this has to do with the accessibility stuff we have been discussing, as people needed to be able to not just drag points around, but also make points move by just clicking where they want it to go. Your direction helped me shave off a bunch of fumbling around, so thanks so much!

Works like a charm!

-Colin