Question about dragOptions magnet

[zekageri]

Is there any possibility to use functions inside the magnet object?

My goal is to limit the dragging of a datapoint to the previous datapoint value. I have a stepline chart where the user would adjust the room temperature in a daily basis. The problem is that the data points can be dragged in the previous direction.

So the problem is that i want to limit the currently dragged data point to be able to drag lower then the previous datapoint's temperature value and time value.

I created a codepen from it

If you comment out the Default_Temp_Data_OK and uncomment the Default_Temp_Data_WRONG data array you can see that it can be set before the previous.

[zekageri]

I figured it out.

on the onDragEnd event i excute a function wich is check the prev and next x coordinates and determines if the dragged point is between the two. If not then delete the point.

onDragEnd: function (e, datasetIndex, index, value) {
                e.target.style.cursor = 'default'
                Prevent_User_From_False_Data_Creation(value.x, index);
            },

function Convert_To_Time_String(Moved){
    var date = new Date(Moved);
    var hours = date.getHours();
    var minutes = date.getMinutes();
    var TimeString = hours + ":" + minutes;
    return TimeString;
}
function Prevent_User_From_False_Data_Creation(NowUNIX, Index) {
    if (Index !== 0) {
        var NextTime ,PrevTime = 0;
        var HasPrev,HasNext = false;
        var Data_is_OK = false;
        if(typeof(Default_Temp_Data[Index - 1]) !== 'undefined'){
            var Converted;
            if(typeof(Default_Temp_Data[Index - 1].x) === "number"){
                Converted = Convert_To_Time_String( Default_Temp_Data[Index - 1].x );
            }else{
                Converted = Default_Temp_Data[Index - 1].x
            }
            PrevTime = Get_Millis ( Converted );
            HasPrev = true;
        }
        if(typeof(Default_Temp_Data[Index + 1]) !== 'undefined'){
            var Converted;
            if(typeof(Default_Temp_Data[Index + 1].x) === "number"){
                Converted = Convert_To_Time_String( Default_Temp_Data[Index + 1].x );
            }else{
                Converted = Default_Temp_Data[Index + 1].x
            }
            NextTime = Get_Millis ( Converted );
            HasNext = true;
        }
        var NowTime = Get_Millis ( Convert_To_Time_String(NowUNIX) );

        if(HasNext && HasNext){
            if(NowTime > PrevTime && NowTime < NextTime){
                Data_is_OK = true;
            }else{
                Data_is_OK = false;
            }
        }else if(HasNext && !HasPrev){
            if(NowTime < NextTime){
                Data_is_OK = true;
            }else{
                Data_is_OK = false;
            }
        }else if(!HasNext && HasPrev){
            if(NowTime > PrevTime){
                Data_is_OK = true;
            }else{
                Data_is_OK = false;
            }
        }

        if(Data_is_OK){
            console.log("OK");
        }else{
            Default_Temp_Data.splice(Index,1);
            myChart.update();
        }

    }
}

function Get_Millis(TimeString) {
    var TimeBefore = TimeString;
    var TimePartsBefore = TimeBefore.split(":");
    var MillisBefore = (+TimePartsBefore[0] * (60000 * 60)) + (+TimePartsBefore[1] * 60000);
    return MillisBefore;
}

The problem was that the plugin converts my hour min time to UNIX timestamps from 1970 so i had to convert it back to a simple hour min string and than convert it to millisec to be able to compare my data and the plugin converted data. But works!

[chrispahm]

Hey @zekageri,

good to hear you figured it out! Best Christoph

[zekageri]

Thank you! If you let me one more question. Can i modify the label that the plugin creates when dragging? I assume it knows that my X axis is in time format and it is writing the time like in the first picture, not like on the second.