github.com/pyroscope-io/pyroscope@v0.37.3-0.20230725203016-5f6947968bd0/pkg/storage/segment/debug_vis.go (about)

     1  package segment
     2  
     3  import (
     4  	"encoding/json"
     5  	"math/big"
     6  	"os"
     7  	"text/template"
     8  	"time"
     9  )
    10  
    11  var visDebuggingEnabled = false
    12  
    13  type visualizeNode2 struct {
    14  	T1      time.Time
    15  	T2      time.Time
    16  	Depth   int
    17  	HasTrie bool
    18  	Samples uint64
    19  	M       int
    20  	D       int
    21  	Used    bool
    22  }
    23  
    24  type vis struct {
    25  	nodes []*visualizeNode2
    26  }
    27  
    28  // This is here for debugging
    29  func newVis() *vis {
    30  	return &vis{nodes: []*visualizeNode2{}}
    31  }
    32  
    33  func (v *vis) add(n *streeNode, r *big.Rat, used bool) {
    34  	if !visDebuggingEnabled {
    35  		return
    36  	}
    37  	v.nodes = append(v.nodes, &visualizeNode2{
    38  		T1:      n.time.UTC(),
    39  		T2:      n.time.Add(durations[n.depth]).UTC(),
    40  		Depth:   n.depth,
    41  		HasTrie: n.present,
    42  		Samples: n.samples,
    43  		M:       int(r.Num().Int64()),
    44  		D:       int(r.Denom().Int64()),
    45  		Used:    used,
    46  	})
    47  }
    48  
    49  type TmpltVars struct {
    50  	Data string
    51  }
    52  
    53  func (v *vis) print(name string) {
    54  	if !visDebuggingEnabled {
    55  		return
    56  	}
    57  	vizTmplt, _ := template.New("viz").Parse(vizTmplt)
    58  
    59  	jsonBytes, _ := json.MarshalIndent(v.nodes, "", "  ")
    60  	jsonStr := string(jsonBytes)
    61  	w, _ := os.Create(name)
    62  	vizTmplt.Execute(w, TmpltVars{Data: jsonStr})
    63  }
    64  
    65  var vizTmplt = `
    66  <html>
    67  
    68  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    69  <script src="http://code.highcharts.com/highcharts.js"></script>
    70  <script src="http://code.highcharts.com/highcharts-more.js"></script>
    71  <script src="http://code.highcharts.com/modules/exporting.js"></script>
    72  <script src="https://cdn.jsdelivr.net/npm/underscore@1.11.0/underscore-min.js"></script>
    73  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.27.0/moment.min.js"></script>
    74  
    75  <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
    76  
    77  <script>
    78  const data = {{ .Data }};
    79  
    80  let lookup = {};
    81  
    82  let formattedData = data;
    83  
    84  formattedData.forEach(function(x){
    85    let k = [x.Depth, moment(x.T1).valueOf()].join("-");
    86    lookup[k] = x;
    87  });
    88  
    89  formattedData = formattedData.map(function(x){return [
    90    x.Depth, moment(x.T1).valueOf(), moment(x.T2).valueOf()
    91  ]});
    92  
    93  $(function () {
    94    $('#container').highcharts({
    95  		chart: {
    96  			type: 'columnrange',
    97  			inverted: true
    98  		},
    99  
   100  		title: {
   101  			text: 'Segments'
   102  		},
   103  
   104  		xAxis: {
   105  			categories: ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11']
   106  		},
   107  
   108  		yAxis: {
   109  			title: {
   110  				text: 'time'
   111  			}
   112  		},
   113  
   114  		tooltip: {
   115  			formatter: function (a,b,c) {
   116  				let key = [this.x,this.y].join("-");
   117  				let obj = lookup[key];
   118  				return JSON.stringify(obj, null, 2);
   119  			}
   120  		},
   121  
   122  		plotOptions: {
   123  			columnrange: {
   124  				dataLabels: {
   125  					enabled: true,
   126  					formatter: function () {
   127  						return this.y;
   128  					}
   129  				}
   130  			}
   131  		},
   132  
   133  		legend: {
   134  			enabled: false
   135  		},
   136  
   137  		series: [{
   138  			name: 'Segment',
   139  			data: formattedData
   140  		}]
   141    });
   142  });
   143  </script>
   144  </html>
   145  `