Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Use devicePixelRatio to scale up and down canvas values in TSVB for Tooltip #13565

Merged
merged 1 commit into from
Aug 18, 2017
Merged

Use devicePixelRatio to scale up and down canvas values in TSVB for Tooltip #13565

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 10 additions & 2 deletions src/core_plugins/metrics/public/visualizations/components/timeseries_chart.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,14 @@ import reactcss from 'reactcss';
import FlotChart from './flot_chart';
import Annotation from './annotation';

export function scaleUp(value) {
return window.devicePixelRatio * value;
}

export function scaleDown(value) {
return value / window.devicePixelRatio;
}

class TimeseriesChart extends Component {

constructor(props) {
Expand All @@ -22,11 +30,11 @@ class TimeseriesChart extends Component {
calculateLeftRight(item, plot) {
const canvas = plot.getCanvas();
const point = plot.pointOffset({ x: item.datapoint[0], y: item.datapoint[1] });
const edge = (point.left + 10) / canvas.width;
const edge = (scaleUp(point.left) + 10) / canvas.width;
let right;
let left;
if (edge > 0.5) {
right = canvas.width - point.left;
right = scaleDown(canvas.width) - point.left;
left = null;
} else {
right = null;
Expand Down