aurora-opensource / xviz

A protocol for real-time transfer and visualization of autonomy data
http://xviz.io
Apache License 2.0
1.01k stars 228 forks source link

Path Layer produces visual artifacts with strokeWidth 1 #536

Open twojtasz opened 4 years ago

twojtasz commented 4 years ago

Reported by @anita on slack. https://slack-files.com/TC45B521H-FP4HYSGEP-759518ea09

Screen Shot 2020-02-18 at 12 18 31 PM

The issue can be observed using https://avs.auto/playground/index.html with the following.

For context, increasing the stroke_width_max_pixels to 1.4 can make the issue go away, as well as removing the point with the comment.

I was thinking numerical stability issue is one possibility, but we should be filtering points in the line to remove those in close proximity to avoid such issues. We do create a tessellation to control the width of the line, so it might be in that code?

Another options was to enable 64-bit projection in the internal deck.gl layer to see if that resolves the issue.

Metadata:

xvizMetadataBuilder
  .startTime(1000)
  .endTime(1005)

  .stream('/vehicle_pose')
  .category('POSE')

  .stream('/vehicle/trajectory_points')
  .category('primitive')
  .type('point')
  .coordinate('IDENTITY')
  .streamStyle({
    point_color_mode: 'elevation',
    point_color_domain: [0, 3],
    radius_pixels: 4
  })

  .stream('/vehicle/trajectory')
  .category('primitive')
  .type('polyline')
  .coordinate('IDENTITY')

  // This styling information is applied to *all* objects for this stream.
  // It is possible to apply inline styling on individual objects.
  .streamStyle({
    stroke_color: '#47B27588',
    stroke_width: 1,
    stroke_width_min_pixels: 1,
    stroke_width_max_pixels: 1,
  });

Frame:

xvizBuilder
  .pose('/vehicle_pose')
  .timestamp(1000.5)
  .position(0, 0 ,0)
  .orientation(0, 0, 0);

var poseTrajectory = 
[[ -0.11617289460096283, 0.13781707090877976, -0.5724146594091549 ],
  [ -0.11823214137964637, 0.1416895563791462, -0.5878673738508813 ],
  [ -0.12016413677274343, 0.14718001833224512, -0.6067662326557816 ],
  [ -0.1884289311590732, 0.25686290636551, -0.9870148641227219 ], // comment me out to see the issue for this point go away
  [ -0.2822506568744056, 0.39890549218922267, -1.518761810467971 ],
  [ -0.28341940609953986, 0.39461442901798227, -1.5312730565934012 ],
  [ -0.3639558908042197, 0.5116322317660574, -1.999972206582057 ],
  [ -0.3652752011099892, 0.5142376001813239, -2.009737450921272 ],
  [ -0.36614264051359063, 0.5163816288101317, -2.0189977094327785 ],
  [ -0.36805080181111965, 0.5235579007188438, -2.0465171532981508 ],
  [ -0.34204478637159397, 0.5285510054475225, -2.356559579276445 ],
  [ -0.3510746810952071, 0.5567668138810212, -2.3782257798876225 ]]
xvizBuilder.primitive('/vehicle/trajectory').polyline(poseTrajectory); 
xvizBuilder.primitive('/vehicle/trajectory_points').points(poseTrajectory);
Pessimistress commented 4 years ago

Set stroke_width_max_pixels to 3 the artifact will go away. This needs some further investigation; the filtering tolerance in the PathLayer vertex shader should have filtered some of the segments out. My guess is the very small segment length + very small width interacted unexpectedly, maybe we are hitting the float precision limit?