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

Jump to bottom

Price label rendering artefacts #1584

Closed
SlicedSilver opened this issue May 8, 2024 · 0 comments · Fixed by #1585 · May be fixed by Beve-hub/investment#2
Closed

Price label rendering artefacts #1584

SlicedSilver opened this issue May 8, 2024 · 0 comments · Fixed by #1585 · May be fixed by Beve-hub/investment#2
Assignees
@SlicedSilver
Labels
bug Unexpected problem or unintended behavior.
Milestone
4.1.x

Comments

@SlicedSilver
Copy link
Contributor

Lightweight Charts™ Version: 4.1.3

Steps/code to reproduce:

  • Open attached code in chrome with 200% zoom

Actual behavior:

The filled area of the price label has a slight rendering artefact near the corners

Expected behavior:

The filled area should appear solid.

Screenshots:

Visual artefacts scale label

Code Sample:

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
	<title>Debug page</title>
	<script type="text/javascript" src="https://unpkg.com/lightweight-charts/dist/lightweight-charts.standalone.production.js"></script>
</head>
<body style="padding: 0; margin: 50px;">
	<div id="container" style="width: 600px; height: 400px; position: relative"></div>
	<script type="text/javascript">

		var chart = LightweightCharts.createChart(
			document.getElementById('container'),
		);

		const data = Array.from({length: 100}).map((_, index) => ({ time: index * 10000, value: index % 10 === 0 ? index : undefined }) );

		const series = chart.addLineSeries();
		series.setData(data);

		chart.timeScale().fitContent();

		series.createPriceLine({
		    price: 70.0,
		    color: 'gray',
		    lineWidth: 1,
		    lineStyle: LightweightCharts.LineStyle.Dashed,
		    title: 'Dashed',
		});

		series.createPriceLine({
		    price: 50.0,
		    color: 'gray',
		    lineWidth: 1,
		    lineStyle: LightweightCharts.LineStyle.LargeDashed,
		    title: 'LargeDashed',
		});

		series.createPriceLine({
		    price: 30.0,
		    color: 'gray',
		    lineWidth: 1,
		    lineStyle: LightweightCharts.LineStyle.Dotted,
		    title: 'Dotted',
		});

		series.createPriceLine({
		    price: 10.0,
		    color: 'gray',
		    lineWidth: 1,
		    lineStyle: LightweightCharts.LineStyle.SparseDotted,
		    title: 'SparseDotted',
		});
	</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@SlicedSilver SlicedSilver

Labels
bug Unexpected problem or unintended behavior.
Projects
None yet
Milestone
4.1.x
1 participant
@SlicedSilver