@code {
[Parameter] public RobotMonitorDto? MonitorData { get; set; }
[Parameter] public bool IsConnected { get; set; }
public class ElementSize
{
public double Width { get; set; }
public double Height { get; set; }
}
public class ElementBoundingRect
{
public double X { get; set; }
public double Y { get; set; }
public double Width { get; set; }
public double Height { get; set; }
}
private ElementReference SvgRef;
private ElementReference SvgContainerRef;
private double ZoomScale = 2.0; // Zoom vào robot hơn khi mở
private const double MIN_ZOOM = 0.1;
private const double MAX_ZOOM = 5.0;
private const double BASE_PIXELS_PER_METER = 50.0;
private double TranslateX = 0;
private double TranslateY = 0;
private bool IsPanning = false;
private double PanStartX = 0;
private double PanStartY = 0;
private double SvgWidth = 800;
private double SvgHeight = 600;
private string PathView = "";
private string PathIsNot = "hidden";
// Mouse world coordinates
private double? MouseWorldX = null;
private double? MouseWorldY = null;
// Map image properties
private const double MapImageOriginX = -20.0; // OriginX in world coordinates (meters)
private const double MapImageOriginY = -20.0; // OriginY in world coordinates (meters)
private const double MapImageResolution = 0.1; // Resolution: meters per pixel
private const string MapImageUrl = "images/gara20250309.png";
private bool MapImageLoaded = false;
private double MapImageWidth = 0; // Width in world coordinates (meters)
private double MapImageHeight = 0; // Height in world coordinates (meters)
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
{
var containerSize = await JS.InvokeAsync