Commit 131a062a authored by Vasily Belolapotkov's avatar Vasily Belolapotkov

fix stroke width affected by transformation matrix

parent 14e36c5e
import { applyElementConfig, makeHtmlElement, toPx } from './ui-utils';
import { ChartComponentFactory } from './chart-component';
import { renderPlots } from './plot';
import { makeTransparentImage } from './transparent-image';
interface IChartPreviewProps {
width: number;
......@@ -205,11 +206,12 @@ export const makeChartPreview: ChartComponentFactory<
attributes: dragAttributes,
});
edgesContainer.addEventListener('dragStart', () => {
edgesContainer.addEventListener('dragstart', evt => {
setGhostImage(evt);
edgesContainer.classList.add('dragging');
});
edgesContainer.addEventListener('dragEnd', () => {
edgesContainer.addEventListener('dragend', () => {
edgesContainer.classList.remove('dragging');
});
......@@ -239,10 +241,7 @@ export const makeChartPreview: ChartComponentFactory<
attributes: dragAttributes,
});
leftEdge.addEventListener('dragstart', () => {
// TODO: set proper drag image
// return false;
});
leftEdge.addEventListener('dragstart', setGhostImage);
leftEdge.addEventListener('drag', evt => {
evt.preventDefault();
......@@ -255,6 +254,7 @@ export const makeChartPreview: ChartComponentFactory<
resizeHandlers.moveLeftEdge(offsetX);
});
rightEdge.addEventListener('dragstart', setGhostImage);
rightEdge.addEventListener('drag', evt => {
evt.preventDefault();
const { offsetX, pageX, clientX } = evt;
......@@ -273,4 +273,8 @@ export const makeChartPreview: ChartComponentFactory<
function getXOffset(leftOffset: number): number {
return leftOffset / previewWidth;
}
function setGhostImage(evt: DragEvent) {
evt.dataTransfer.setDragImage(makeTransparentImage(), 0, 0);
}
};
......@@ -90,7 +90,12 @@ body.dark a {
.plot-line {
fill: none;
stroke-width: 1;
vector-effect: non-scaling-stroke;
stroke-width: 2px;
}
.preview-container .plot-line {
stroke-width: 1px;
}
.axis-labels {
......
// tslint:disable-next-line:max-line-length
const transparentImgUrl = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=';
let img: HTMLImageElement;
export function makeTransparentImage(): HTMLElement {
if (img) {
return img;
}
img = new Image(1, 1);
img.src = transparentImgUrl;
document.body.appendChild(img);
return img;
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment