player graph | tmserver.org

current_players_cnt = 383;
// Testdaten
data = [178, 179, 170, 177, 171, 179, 181, 186, 178, 187, 184, 190, 199, 191, 195, 206, 207, 201, 211, 219, 214, 218, 225, 225, 222, 216, 211, 206, 216, 211, 212, 212, 220, 227, 220, 223, 232, 230, 223, 217, 217, 218, 212, 206, 201, 194, 201, 201, 200, 199, 207, 199, 197, 205, 196, 198, 199, 197, 206, 217, 208, 218, 224, 221, 216, 220, 221, 221, 222, 215, 220, 231, 225, 216, 207, 207, 198, 202, 195, 202, 200, 199, 198, 195, 192, 185, 179, 180, 174, 173, 164, 161, 154, 156, 157, 167, 172, 176, 174, 164, 163, 162, 163, 161, 165, 162, 165, 170, 169, 161, 162, 164, 169, 172, 165, 167, 159, 161, 166, 160, 168, 159, 154, 159, 159, 168, 164, 168, 163, 163, 156, 167, 170, 175, 165, 176, 168, 167, 176, 169, 162, 164, 174, 168, 173, 182, 178, 168, 176, 179, 177, 177, 169, 176, 176, 167, 161, 161, 168, 176, 175, 170, 177, 180, 187, 182, 182, 178, 179, 175, 176, 172, 177, 183, 179, 186, 187, 195, 203, 212, 206, 196, 188, 178, 175, 172, 170, 178, 168, 162, 162, 172, 168, 173, 170, 160, 160, 163, 165, 160, 169, 172, 170, 166, 158, 166, 171, 172, 162, 170, 166, 157, 162, 156, 158, 159, 168, 178, 180, 176, 186, 186, 177, 179, 189, 182, 179, 180, 181, 188, 197, 198, 191, 184, 192, 190, 194, 187, 177, 173, 174, 169, 165, 154, 159, 155, 156, 152, 148, 157, 164, 155, 163, 162, 170, 171, 166, 174, 172, 163, 156, 155, 150, 145, 138, 130, 122, 131, 125, 119, 113, 120, 112, 117, 123, 125, 121, 120, 111, 110, 109, 115, 107, 111, 105, 96, 85, 93, 98, 90, 81, 72, 61, 58, 53, 45, 40, 40, 40, 40, 50, 59, 63, 63, 62, 58, 57, 61, 55, 55, 53, 51, 47, 45, 46, 52, 57, 60, 60, 52, 56, 54, 48, 51, 53, 50, 40, 40, 40, 40, 40, 40, 40, 40, 40, 40, 42, 40, 48, 44, 40, 45, 40, 46, 52, 41, 40, 41, 40, 40, 40, 40, 47, 45, 43, 42, 51, 41, 50, 56, 45, 40, 40, 40, 40, 42, 48, 51, 45, 53, 48, 49, 53, 56, 58, 64, 52, 43, 43, 47, 42, 40, 40, 48, 41, 41, 49, 49, 40, 45, 52, 45, 47, 40, 40, 40, 40, 43, 48, 54, 44, 49, 49, 46, 54, 43, 40, 42, 49, 45, 44, 40, 40, 40, 49, 42, 40, 49, 55, 57, 54, 45, 47, 49, 53, 61, 54, 48, 51, 51, 59, 65, 64, 53, 55, 44, 45, 48, 53, 45, 53, 60, 62, 61, 58, 53, 42, 47, 54, 62, 70, 68, 63, 66, 64, 71, 70, 78, 84, 79, 75, 78, 73, 67, 72, 71, 70, 75, 76, 84, 78, 76, 74, 66, 70, 67, 56, 58, 60, 63, 63, 71, 78, 81, 71, 78, 74, 77, 75, 71, 79, 78, 88, 78, 72, 72, 63, 63, 60, 56, 49, 59, 58, 63, 57, 60, 53, 57, 47, 56, 58, 54, 55, 52, 51, 42, 40, 40, 40, 43, 40, 40, 40, 49, 59, 62, 69, 79, 76, 69, 79, 78, 68, 78, 71, 62, 66, 57, 53, 43, 42, 40, 41, 46, 55, 65, 70, 77, 81, 91, 98, 99, 103, 101, 91, 96, 87, 90, 90, 95, 90, 81, 80, 77, 77, 87, 90, 88, 91, 99, 101, 102, 107, 100, 98, 98, 93, 103, 114, 118, 126, 120, 128, 137, 139, 137, 142, 149, 140, 142, 141, 147, 139, 134, 134, 144, 151, 147, 150, 145, 142, 146, 146, 140, 137, 140, 140, 144, 147, 142, 135, 131, 141, 138, 145, 138, 143, 141, 138, 142, 140, 142, 136, 130, 121, 130, 138, 145, 152, 163, 160, 151, 147, 157, 165, 173, 175, 182, 192, 191, 190, 186, 178, 170, 163, 165, 170, 164, 169, 160, 169, 166, 157, 149, 148, 147, 149, 154, 155, 159, 159, 156, 151, 156, 161, 154, 161, 158, 159, 156, 167, 161, 162, 153, 160, 164, 156, 158, 157, 163, 172, 165, 176, 174, 183, 192, 194, 204, 199, 195, 190, 182, 189, 195, 187, 193, 196, 195, 193, 186, 197, 198, 190, 194, 204, 203, 201, 211, 215, 206, 207, 204, 200, 200, 203, 205, 207, 199, 205, 207, 212, 210, 205, 207, 213, 215, 215, 224, 222, 229, 239, 231, 224, 220, 220, 215, 227, 223, 214, 216, 214, 217, 227, 220, 222, 229, 235, 241, 236, 231, 227, 219, 224, 224, 231, 238, 239, 230, 222, 220, 213, 221, 219, 214, 221, 218, 210, 210, 214, 221, 212, 222, 221, 222, 229, 229, 231, 234, 230, 228, 236, 230, 226, 220, 214, 212, 213, 204, 199, 193, 191, 188, 188, 195, 195, 187, 193, 189, 185, 183, 176, 184, 193, 196, 188, 184, 179, 172, 179, 186, 194, 191, 184, 189, 192, 195, 199, 197, 204, 212, 219, 221, 229, 238, 247, 251, 249, 250, 249, 245, 249, 248, 249, 259, 259, 263, 261, 261, 267, 276, 276, 272, 263, 257, 263, 260, 265, 268, 262, 271, 262, 267, 277, 285, 282, 284, 283, 288, 280, 287, 298, 288, 283, 280, 284, 290, 295, 287, 288, 290, 280, 281, 290, 286, 296, 287, 293, 288, 298, 308, 303, 311, 318, 310, 310, 314, 307, 301, 292, 286, 288, 284, 282, 280, 288, 295, 294, 299, 309, 305, 314, 309, 302, 294, 302, 306, 311, 321, 315, 320, 316, 310, 308, 307, 310, 315, 322, 320, 317, 310, 311, 307, 313, 316, 321, 330, 321, 315, 311, 311, 311, 309, 311, 314, 314, 319, 310, 316, 309, 303, 308, 300, 293, 297, 293, 302, 299, 299, 305, 306, 315, 306, 295, 299, 291, 283, 277, 267, 260, 252, 245, 248, 257, 251, 242, 236, 237, 244, 247, 237, 234, 223, 218, 208, 210, 214, 222, 221, 216, 208, 215, 219, 220, 220, 225, 223, 226, 232, 221, 211, 205, 197, 192, 181, 177, 174, 169, 159, 168, 169, 167, 174, 170, 161, 151, 158, 156, 148, 152, 146, 141, 150, 139, 133, 140, 140, 129, 127, 130, 139, 139, 144, 151, 141, 132, 139, 138, 146, 140, 146, 150, 151, 158, 157, 148, 140, 135, 135, 143, 136, 129, 137, 142, 150, 142, 150, 153, 146, 146, 144, 151, 144, 139, 133, 127, 119, 112, 107, 104, 95, 93, 92, 97, 87, 78, 74, 78, 80, 87, 91, 92, 88, 87, 86, 91, 100, 91, 88, 82, 86, 89, 79, 87, 87, 84, 84, 79, 79, 78, 67, 73, 62, 57, 58, 54, 45, 53, 55, 55, 47, 40, 40, 48, 46, 48, 40, 47, 43, 40, 40, 40, 41, 40, 40, 42, 40, 43, 51, 53, 61, 58, 51, 42, 44, 40, 40, 45, 40, 40, 40, 40, 41, 41, 40, 40, 40, 40, 40, 40, 43, 52, 50, 50, 49, 46, 44, 40, 40, 41, 40, 40, 45, 45, 44, 49, 45, 40, 40, 40, 40, 48, 41, 40, 49, 40, 40, 40, 40, 43, 47, 44, 40, 44, 40, 46, 40, 40, 45, 45, 43, 40, 49, 47, 47, 49, 50, 42, 46, 55, 46, 43, 40, 40, 40, 42, 40, 40, 40, 40, 40, 45, 51, 59, 62, 59, 49, 55, 61, 67, 69, 66, 73, 83, 85, 76, 75, 77, 72, 79, 87, 85, 78, 86, 79, 71, 66, 68, 73, 63, 60, 60, 59, 57, 58, 59, 60, 50, 48, 57, 47, 54, 52, 51, 45, 55, 60, 68, 66, 76, 67, 76, 86, 77, 78, 78, 81, 80, 84, 92, 89, 79, 75, 69, 62, 61, 67, 66, 63, 64, 73, 83, 78, 78, 78, 85, 93, 84, 76, 79, 79, 84, 89, 84, 88, 82, 88, 84, 84, 76, 87, 85, 89, 96, 93, 84, 84, 87, 78, 84, 91, 82, 76, 73, 66, 61, 64, 55, 54, 58, 59, 67, 73, 66, 57, 54, 56, 62, 68, 59, 63, 66, 75, 85, 80, 87, 84, 87, 83, 85, 82, 80, 74, 77, 68, 77, 80, 73, 65, 62, 57, 67, 65, 70, 75, 82, 91, 101, 103, 101, 103, 103, 111, 113, 122, 131, 130, 135, 139, 140, 146, 154, 158, 159, 168, 164, 156, 154, 157, 160, 163, 156, 156, 155, 155, 148, 144, 150, 156, 167, 171, 182, 189, 191, 185, 186, 187, 186, 181, 176, 173, 176, 184, 185, 191, 191, 182, 191, 182, 184, 189, 200, 202, 207, 198, 204, 209, 215, 211, 214, 220, 214, 225, 225, 232, 226, 223, 226, 224, 218, 210, 215, 211, 207, 208, 211, 213, 221, 215, 209, 219, 224, 220, 215, 220, 228, 224, 216, 214, 210, 214];

canvas = $('canvas');

// Setup
var height = canvas.prop('height');
var width = canvas.prop('width');

function screen_x(x)
{
    return 10 + (width - 10)/1440*x;
}

function screen_y(y)
{
    return height - 10 - Math.floor(y / 100 * 35);
}

canvas
    .clearCanvas()
    .scaleCanvas({
      scale: 1
    })
    .translateCanvas({
      translateX: 0.5,
      translateY: 0.5
    });

// Draw Y-Axis
canvas.drawLine({
        strokeStyle: '#b5cbdb',
        strokeWidth: 1,
        x1: screen_x(0), y1: screen_y(400),
        x2: screen_x(0), y2: screen_y(0),
    });

// Y-Ticks
for (var i = 0; i < current_players_cnt; i += 50) {
    if (i % 100 == 0) {
        // Main ticks
        canvas
            .drawLine({
                strokeStyle: '#b5cbdb',
                strokeWidth: 1,
                x1: screen_x(-10), y1: screen_y(i),
                x2: screen_x(0)  , y2: screen_y(i)
            });
    } else {
        //
        canvas
            .drawLine({
                strokeStyle: '#b5cbdb',
                strokeWidth: 1,
                x1: screen_x(-5), y1: screen_y(i),
                x2: screen_x(0) , y2: screen_y(i)
            });
    }
}

// Draw X-Axis
canvas.drawLine({
        strokeStyle: '#b5cbdb',
        strokeWidth: 1,
        x1: screen_x(0)   , y1: screen_y(0),
        x2: screen_x(1440), y2: screen_y(0),
    });


for (var i = 1; i < data.length; i++) {
    canvas.drawLine({
        strokeStyle: '#ffffff',
        strokeWidth: 1,
        x1: screen_x(i-1), y1: screen_y(data[i-1]),
        x2: screen_x(i)  , y2: screen_y(data[i]),
    });
}