HTML5 API - Heat Layer Points Not Working

Question

Hi everyone,
Really weird issue this, and I am honestly at a loss to explain what's going on, so hopefully someone can spot my mistake!
I want to overlay a density-based heat map over a map of Britain, based on longitude/latitude points stored in OBIEE columns. I have copied and pasted some of the code (modifying it for my needs) from the SampleApp v406 "dynamic heat layer" demonstration.
My "showMap(darray)" function is what is responsible for building and displaying the map. darray in this case is an 2-dimensional array containing all the OBIEE data in [row number][column number] format which is fed in via a narrative view. Note that mapview, heatLayer and eventsLayer are global variables defined in the main script body. Below is the code:
function showMap(darray) {
   var baseURL  = "http://"+document.location.host+"/mapviewer";
   mapview = new OM.Map(document.getElementById("map"), { mapviewerURL:baseURL });
   mapview.addLayer(new OM.layer.ElocationTileLayer("background"));
   var marker = new OM.style.Marker({src: "/mapviewer/icons/BALL_sel.png", width:7, height:7});
   var heatStyle = getStyle();
  heatLayer = new OM.layer.VectorLayer("heatLayer",
            def:
                type: OM.layer.VectorLayer.TYPE_LOCAL
                renderingStyle: heatStyle
  addPoints(darray, heatLayer);
  mapview.addLayer(heatLayer);
eventsLayer = new OM.layer.VectorLayer("eventsLayer",
            def:
                type: OM.layer.VectorLayer.TYPE_LOCAL
                renderingStyle: marker
  addPoints(darray, eventsLayer);
  mapview.addLayer(eventsLayer);
  // Set the initial map center and zoom level
  var mapCenterLat = 51.14076;
  var mapCenterLon = 0.88016;
  var mapZoom = 8;
  var mpoint = new OM.geometry.Point(mapCenterLon,mapCenterLat,8307);
  mapview.setMapCenter(mpoint); 
  mapview.setMapZoomLevel(mapZoom);
  console.log(heatLayer);
  mapview.init();
Here is the getStyle() function definition, it simply returns a style for the heat map to use.
function getStyle(){
  var colors = ["#C6DBEF","#6BAED6","#008fff","#00abff","#00d5ff","#00ffff","#00ff7f","#00ff00","#7fff00","#ffff00","#ffd500","#ffab00","#ff7f00","#ff5600","#ff2b00", "#ff0000", "#A50F15"];
  var config = {
    spotlightRadius:25,
    lengthUnit:"pixel",
    colorStops: colors,
    opacity:0.65,                 
    sampleFactor: 1
  var heatStyle = new OM.style.HeatMap(config);
  return heatStyle;
and here is the addPoints(darray) function which is responsible for plotting points on the layer:
function addPoints(darray,layer) {
  /*lat,long,estb,metric*/
  for (i=0;i<darray.length; i++) {
      var fid = i;
      var mpoint = new OM.geometry.Point(darray[i][4], darray[i][3], 8307);
      var f_attr = {attributes :{"Car Number":darray[i][0], "Event":darray[i][2], "Time":darray[i][1]}};
      var feature = new OM.Feature(fid,mpoint,f_attr);
      layer.addFeature(feature);
I apologise for the code dump, but I thought it would be necessary to help troubleshoot.
My issue is that any layer using the "marker" style displays the points in the correct place, but the heat layer, which uses the "heatStyle" style, stacks all of its points at 0,0 which is somewhere just off the west coast of Africa! You'll notice the call to console.log(heatLayer), investigating this reveals that the correct GPS coordinates are being stored in the heat layer's feature array, it's just for some reason rendering them all at 0,0. This is what normally happens if you use an invalid SRID and it doesn't know where to put them on the map (if I change mpoint in addPoints() to use -1 as a SRID for example, then it does the same thing to the eventsLayer layer), but both layers use the same function. I have torn apart my code several times trying to understand why it's doing this, and compared it to the code in the SampleApp v406 demo and it's identical! The only difference is that I've modified getStyle() to return a static definition since I'm not allowing my users to modify the heat layer style. I've also got another visualisation with the same heat style definition and it works fine, though that is not based on a world-map but a custom one.
I've also tried clearing all caches, including the presentation layer and mapviewer server, as well as my browser's cache, and it's still not working.
EDIT: I have also discovered that any functions called from heatLayer, such as setVisible(true/false), produces a javascript error in oraclemapsv2.js "ReferenceError: layer is not defined", but only if the call is made OUTSIDE the showMap function. It looks like, for whatever reason, heatLayer works fine until showMap() is finished, and then it suddenly stops working? Remember that heatLayer is a global variable, so it is not a scope issue. What is going on?! Also, calling console.log(heatLayer) in the same function as my setVisible() call shows that heatLayer is still defined and still contains the same data, it's just that oraclemapsv2.js no longer recognises it. Is this a bug or something?
If anyone can identify what I've done wrong, I would be extremely grateful!
Thanks,
Richard

Answer 1

Hi Mark,
Can you post the create index command, as well as the contents of user_sdo_geom_metadata for the point layer?
Also, can you post the results of doing a select count(*) from the index table as well as select count(*) from the point table?
Thanks,
dan