0

I have a graphite server running and collecting data. This has been working for months. I found cubism.js and I want to make it work and have had zero luck. Using the code found here under Modify Cubism.js Graphite Title Text. I can not get cubism.js working. code: ( changed server name ).

<!DOCTYPE html>
<meta charset="utf-8" />
Cubism.js</pre>
<style>
</style>
<div id="body">
<h2>Host01 Load Average</h2>
<div id="graphs"></div>
<script type="text/javascript" src="d3.v3.js"></script>
<script type="text/javascript" src="cubism.v1.js"></script>
<script type="text/javascript" src="highlight.min.js"></script>
<script type="text/javascript">
{font-family:arial,helvettica,sans-serif"}
</script>

<script type="text/javascript">

var context = cubism.context()
.step( 1 * 30 * 1000 )
.size(960);

 var graphite = context.graphite("http://graphite.examp.com");
 graphFind = 'PDU.*.B-AMPS'

 graphite.find(graphFind, function(error, results) {
  // Map find results to array and set to graphite.metric object type
  var metrics = results.sort().map(function(i) {
  return graphite.metric(i);
  });

  // loop through array and print stuff to "graphs" div
  for (var i=0;i<metrics.length;i++){
   d3.select("#graphs").call(function(div) {
   div.append("div")
    .selectAll(".horizon")
    .data([metrics[i]])
    .enter()
    .append("div")
    .attr("class", "horizon")
    .call(context.horizon());
    });
    }
    });

ok

on the url screen I see Cubism.js Host01 Load Average no data:

viewing page source , look like above, viewing logs on graphte server. 

xxx.xxx.116.130 - - [28/Mar/2014:17:17:56 -0500] "GET /metrics      
/find?format=completer&     query=PDU.*.B-AMPS HTTP/1.1" 200 436

in a browser I can 

http://graphite.examp.com/metrics/find?format=completer&query=PDU.*.B-AMPS

and get 

{"metrics": [{"is_leaf": "1", "path": "PDU.rack1a.B-AMPS", "name": "B-AMPS"},
{"is_leaf": "1", "path": "PDU.rack2a.B-AMPS", "name": "B-AMPS"}, 
{"is_leaf": "1", "path": "PDU.rack2b.B-AMPS", "name": "B-AMPS"}, 
{"is_leaf": "1", "path": "PDU.rack3a.B-AMPS", "name": "B-AMPS"}, 
{"is_leaf": "1", "path": "PDU.rack3b.B-AMPS", "name": "B-AMPS"}, 
{"is_leaf": "1", "path": "PDU.rack4a.B-AMPS", "name": "B-AMPS"}, 
{"is_leaf": "1", "path": "PDU.rack4b.B-AMPS", "name": "B-AMPS"}, 
{"is_leaf": "1", "path": "PDU.rack5a.B-AMPS", "name": "B-AMPS"}, 
{"is_leaf": "1", "path": "PDU.rack5b.B-AMPS", "name": "B-AMPS"}, 
{"is_leaf": "1", "path": "PDU.rack6a.B-AMPS", "name": "B-AMPS"}, 
{"is_leaf": "1", "path": "PDU.rack6b.B-AMPS", "name": "B-AMPS"}, 
{"is_leaf": "1", "path": "PDU.rack7a.B-AMPS", "name": "B-AMPS"}, 
{"is_leaf": "1", "path": "PDU.rack7b.B-AMPS", "name": "B-AMPS"}, 
{"is_leaf": "1", "path": "PDU.rack8a.B-AMPS", "name": "B-AMPS"}, 
{"is_leaf": "1", "path": "PDU.rack9a.B-AMPS", "name": "B-AMPS"}, 
{"is_leaf": "1", "path": "PDU.rack9b.B-AMPS", "name": "B-AMPS"}]}

note: this files exist and I have tried various online versions of them 

<script type="text/javascript" src="d3.v3.js"></script>
<script type="text/javascript" src="cubism.v1.js"></script>
<script type="text/javascript" src="highlight.min.js"></script

I would like to figure out why I can not get any examples I find anywhere to work. Some I try I get nice time rulers , but never and data.

Any help on this or a link to a example that works. would be great.

Racil Hilan
  • 24,690
  • 13
  • 50
  • 55
user3476069
  • 1

2 Answers2

0

apache2 from command line run.. a2enmod headers inside your VirtualHost tags install this Header set Access-Control-Allow-Origin "*" Header set Access-Control-Allow-Methods "GET, OPTIONS" Header set Access-Control-Allow-Headers "origin, authorization, accept"

you should start to see data, I did.

user3476069
  • 1
0

found it apache2 add this inside your tags.

Header set Access-Control-Allow-Origin "*" Header set Access-Control-Allow-Methods "GET, OPTIONS" Header set Access-Control-Allow-Headers "origin, authorization, accept"

user3476069
  • 1