morrisjs / morris.js

Pretty time-series line graphs
http://morrisjs.github.com/morris.js/
6.92k stars 1.23k forks source link

instability around: error <path> M0,0 error when using Area sample code #785

Open h3rb opened 4 years ago

h3rb commented 4 years ago
  x @ raphael.min.js:1
  k @ raphael.min.js:1
  t._engine.path @ raphael.min.js:1
  i.path @ raphael.min.js:1
  c.drawLinePath @ morris.min.js:6
  c._drawLineFor @ morris.min.js:6
  c.drawSeries @ morris.min.js:6
  c.draw @ morris.min.js:6
  d.redraw @ morris.min.js:6
  d.setData @ morris.min.js:6
  d @ morris.min.js:6
  c @ morris.min.js:6
  InspectPlantScanSamples @ app.js:996
  onclick @ (index):1

Data inputs:

(2) ["Sample 1", "Sample 2"] 0: "Sample 1" 1: "Sample 2" length: 2 proto: Array(0) app.js:993 (2) ["s0", "s1"] 0: "s0" 1: "s1" length: 2 proto: Array(0) app.js:994 (11) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}] 0: {id: "a1", s0: 907.8238604502, s1: 861.80376033962} 1: {id: "a2", s0: 836.37650466608, s1: 1085.8100263143} 2: {id: "a3", s0: 1085.6568931578, s1: 1155.3155665406} 3: {id: "a4", s0: 1274.0297912547, s1: 1093.7438674094}

4: {id: "a5", s0: 1062.3838605174, s1: 1420.4553909617} 5: {id: "a6", s0: 830.69972926445, s1: 1616.8402749992} 6: {id: "a7", s0: 1111.9445414266, s1: 1407.5735283138} 7: {id: "a8", s0: 917.54195838625, s1: 1532.8978053375} 8: {id: "a9", s0: 902.16928041313, s1: 1985.5823021829} 9: {id: "a10", s0: 976.40861653814, s1: 1251.3202511371} 10: {id: "a11", s0: 976.0476516573, s1: 1364.2759340354} length: 11 proto: Array(0)

calling function:
new Morris.Bar({ element: 'jsapp-chart-size', data: sizedata, xkey: 'id', ykeys: sizekeys, behaveLikeLine: true, fillOpacity: 0.55, labels: layerlabels });

h3rb commented 4 years ago

Please note: this issue was fixed when I moved around the way this data was populated:

new calling function:

var chartconfig={ element: 'jsapp-chart-size',  data: sizedata, xkey: 'id', ykeys: sizekeys, behaveLikeLine: true, fillOpacity: 0.55, labels: layerlabels };
 new Morris.Bar(chartconfig);

Note that above code breaks when Bar is changed to Line or Area

h3rb commented 4 years ago

image

Appears that some rectangles in the bar chart were rendering with a negative value due to size of div and large number of datapoints.

h3rb commented 4 years ago

image