prometheus
1/*
2SPDX-License-Identifier: MIT
3Source: https://github.com/grafana/grafana/blob/main/public/vendor/flot/jquery.flot.crosshair.js
4*/
5
6/* eslint-disable prefer-spread */
7/* eslint-disable no-loop-func */
8/* eslint-disable @typescript-eslint/no-this-alias */
9/* eslint-disable no-redeclare */
10/* eslint-disable no-useless-escape */
11/* eslint-disable prefer-const */
12/* eslint-disable @typescript-eslint/explicit-function-return-type */
13/* eslint-disable @typescript-eslint/no-use-before-define */
14/* eslint-disable eqeqeq */
15/* eslint-disable no-var */
16/* Flot plugin for showing crosshairs when the mouse hovers over the plot.
17
18Copyright (c) 2007-2014 IOLA and Ole Laursen.
19Licensed under the MIT license.
20
21The plugin supports these options:
22
23crosshair: {
24mode: null or "x" or "y" or "xy"
25color: color
26lineWidth: number
27}
28
29Set the mode to one of "x", "y" or "xy". The "x" mode enables a vertical
30crosshair that lets you trace the values on the x axis, "y" enables a
31horizontal crosshair and "xy" enables them both. "color" is the color of the
32crosshair (default is "rgba(170, 0, 0, 0.80)"), "lineWidth" is the width of
33the drawn lines (default is 1).
34
35The plugin also adds four public methods:
36
37- setCrosshair( pos )
38
39Set the position of the crosshair. Note that this is cleared if the user
40moves the mouse. "pos" is in coordinates of the plot and should be on the
41form { x: xpos, y: ypos } (you can use x2/x3/... if you're using multiple
42axes), which is coincidentally the same format as what you get from a
43"plothover" event. If "pos" is null, the crosshair is cleared.
44
45- clearCrosshair()
46
47Clear the crosshair.
48
49- lockCrosshair(pos)
50
51Cause the crosshair to lock to the current location, no longer updating if
52the user moves the mouse. Optionally supply a position (passed on to
53setCrosshair()) to move it to.
54
55Example usage:
56
57var myFlot = $.plot( $("#graph"), ..., { crosshair: { mode: "x" } } };
58$("#graph").bind( "plothover", function ( evt, position, item ) {
59if ( item ) {
60// Lock the crosshair to the data point being hovered
61myFlot.lockCrosshair({
62x: item.datapoint[ 0 ],
63y: item.datapoint[ 1 ]
64});
65} else {
66// Return normal crosshair operation
67myFlot.unlockCrosshair();
68}
69});
70
71- unlockCrosshair()
72
73Free the crosshair to move again after locking it.
74*/
75
76(function($) {77const options = {78crosshair: {79mode: null, // one of null, "x", "y" or "xy",80color: 'rgba(170, 0, 0, 0.80)',81lineWidth: 1,82},83};84
85function init(plot) {86// position of crosshair in pixels87const crosshair = { x: -1, y: -1, locked: false };88
89plot.setCrosshair = function setCrosshair(pos) {90if (!pos) crosshair.x = -1;91else {92const o = plot.p2c(pos);93crosshair.x = Math.max(0, Math.min(o.left, plot.width()));94crosshair.y = Math.max(0, Math.min(o.top, plot.height()));95}96
97plot.triggerRedrawOverlay();98};99
100plot.clearCrosshair = plot.setCrosshair; // passes null for pos101
102plot.lockCrosshair = function lockCrosshair(pos) {103if (pos) plot.setCrosshair(pos);104crosshair.locked = true;105};106
107plot.unlockCrosshair = function unlockCrosshair() {108crosshair.locked = false;109};110
111function onMouseOut() {112if (crosshair.locked) return;113
114if (crosshair.x != -1) {115crosshair.x = -1;116plot.triggerRedrawOverlay();117}118}119
120function onMouseMove(e) {121if (crosshair.locked) return;122
123if (plot.getSelection && plot.getSelection()) {124crosshair.x = -1; // hide the crosshair while selecting125return;126}127
128const offset = plot.offset();129crosshair.x = Math.max(0, Math.min(e.pageX - offset.left, plot.width()));130crosshair.y = Math.max(0, Math.min(e.pageY - offset.top, plot.height()));131plot.triggerRedrawOverlay();132}133
134plot.hooks.bindEvents.push(function(plot, eventHolder) {135if (!plot.getOptions().crosshair.mode) return;136
137eventHolder.mouseout(onMouseOut);138eventHolder.mousemove(onMouseMove);139});140
141plot.hooks.drawOverlay.push(function(plot, ctx) {142const c = plot.getOptions().crosshair;143if (!c.mode) return;144
145const plotOffset = plot.getPlotOffset();146
147ctx.save();148ctx.translate(plotOffset.left, plotOffset.top);149
150if (crosshair.x != -1) {151const adj = plot.getOptions().crosshair.lineWidth % 2 ? 0.5 : 0;152
153ctx.strokeStyle = c.color;154ctx.lineWidth = c.lineWidth;155ctx.lineJoin = 'round';156
157ctx.beginPath();158if (c.mode.indexOf('x') != -1) {159const drawX = Math.floor(crosshair.x) + adj;160ctx.moveTo(drawX, 0);161ctx.lineTo(drawX, plot.height());162}163if (c.mode.indexOf('y') != -1) {164const drawY = Math.floor(crosshair.y) + adj;165ctx.moveTo(0, drawY);166ctx.lineTo(plot.width(), drawY);167}168ctx.stroke();169}170ctx.restore();171});172
173plot.hooks.shutdown.push(function(plot, eventHolder) {174eventHolder.unbind('mouseout', onMouseOut);175eventHolder.unbind('mousemove', onMouseMove);176});177}178
179$.plot.plugins.push({180init: init,181options: options,182name: 'crosshair',183version: '1.0',184});185})(window.jQuery);186