Event

[Julien]

Hello,

I can't properly handle events with JSXGraph. I want to create points when the cursor is moved and remove the old ones. I wish it would work with mouse and tablet. My example only works up to the value 4 oddly. A little helping hand is welcome.

Have a good day !

https://jsfiddle.net/Julien8/3750jzef/

[Alfred Wassermann]

It seems that there simply is a typo in the code: lenght instead of length.

The code in https://jsfiddle.net/z8x3u0f4/ works for me on iPad and PC:

JXG.Options.point.fixed = false;

JXG.Options.point.showInfobox=true;

JXG.Options.point.highlight=false;

JXG.Options.point.name = "";

JXG.Options.point.face = "[]";

JXG.Options.point.size = 5;

JXG.Options.point.withLabel=true;

const board = JXG.JSXGraph.initBoard('jsxbox1', {axis:false, boundingbox: [-10,-2,10,2], shownavigation:false,showCopyright : false, showZoom : true,keepaspectratio : false,   zoom: {factorX: 1.25,factorY: 1.25,wheel: true,needShift: false,eps: 0.001},   pan: {needShift: false,enabled: true,needTwoFingers: true,pinchHorizontal: true, pinchVertical: true,pinchSensitivity: 7}});

const xaxis = board.create('axis', [[0, 0], [1,0]]);

var p1=board.create('glider',[-8,0,xaxis],{name:'x_{min}', strokeColor:'black'});

var p2=board.create('glider',[8,0,xaxis],{name:'x_{max}', strokeColor:'black'});

board.create('line',[p1,p2],{straightFirst:false, straightLast:false});

var n = board.create('slider',[[1,1.5],[5,1.5],[1,1,10]],{name:'n',snapWidth:1});

board.suspendUpdate();

var lp=[];

n.on('drag', function(e){ 

  if (lp.length > 0) {

    for (let i = 0; i <10; i++) {

  board.removeObject(lp[i]);

  }

    lp.length=0;  

  }

});

n.on('up', function(e){

var az=p1.X();

var bz=p2.X();

var nz=n.Value();

var hz=(bz-az)/nz;

for (let i = 1; i < nz; i++) {lp.push(board.create('point',[az+hz*i,0],{name:"C_\{"+i+"\}",Color:'green'}));};

});

board.unsuspendUpdate();

Best wishes,

Alfred

[Julien]

Thanks for the help. That's great.

The code works on android tablet.