RAM Memory & CPU usage increasing in android mdevice when highlighting

[rishiphp]

Hi,

i've using this plugin, everthing works correctly. But in android device(2.2 +),

when i'm using highlight or set function device's ram and cpu slightly increasing lot & lot, finally apps get closed..

without this hightlighting fn app hadn't crashing.. herre my code below..

my key is "data-full"

    var img = $('#theImg');
img.mapster({
    mapScale: true,
    mapKey: 'data-full',
    isSelectable: true,
    isDeselectable: true,
    singleSelect: true,     
            fillColor: 'ff0000',
            stroke: true,
           strokeColor: '00ff00',
           strokeWidth: 2,
    fillOpacity: 0.8,
    strokeOpacity: 0.7,
}); //close mapster

$('.dragstate').css('z-index', 20).draggable({
    drag: function (e, ui) {
        $(this).css('z-index', 20);
        var TipPos = $(this).offset(), // Track the Position of Dragged Element. Scrolling is not considered here.
            ElementAtTip = document.elementFromPoint(TipPos.left - 1, TipPos.top - ($(window).scrollTop()) + 10);
        img.mapster('highlight', false); // Remove the highlighting while dragging to avoid confusion
        $(ElementAtTip).mapster('highlight', true); // Highlighting the hotspot which below at tip
    },
    containment: ".ui-page",
    revert: false
});

img.droppable({
    drop: function (e, ui) {
        $(ui.draggable).css('z-index', 20);
        var TipPos = $(ui.draggable).offset(), // Track the Position of Dragged Element. Scrolling is not considered here.
            newX = TipPos.left - 1,
            newY = TipPos.top - (($(window).scrollTop()) - 10), 
            ElementAtTip = document.elementFromPoint(newX, newY), 
            DroppedAreaName = $(ElementAtTip).attr('data-full'),
            DraggedLabelName = $(ui.draggable).attr('data-full');
        if (DroppedAreaName != null ) {
            checkAnswer(DraggedLabelName, DroppedAreaName);             
        }           
    }
});

How to resolve this.. Please help...

[jamietre]

Can you provide me with a link a demonstration of the problem? I can't test it without the markup, thanks.

[jamietre]

You're using 1.2.4, which is really old so definitely try upgrading to 1.2.5 (officially released as of yesterday, though I've been telling people to use the dev code for months!!)

I hope that solves your problem - there are many performance improvements and bug fixes. If not I'll take another look.

[rishiphp]

Hi, I've tried with 1.2.5 only.. here hightlighting function itself not working in android device, but web its working fine. and the memory issue has still there..

Please help..

[jamietre]

Honestly I am probably not going to be able to help much unless you can give me some more specific information, like a section of code that's looping infinitely causing the crash?

I don't develop for android specifically, and have never used any android debugging tools so I wouldn't even no where to begin in finding the cause of a memory leak, if it's only on android. This could have to do with jquery mobile or phonegap or a browser...

[rishiphp]

Hi,

Thanks for your response.

actually this a Drag and Drop Game.

We have image with no of mapped areas left side,

and right side i'm having list of part names(label) in dragging mode,

here each label image having a arrow with red dot.

Now i'm dragging the label, if the red dot enters into area,

i've use "elementFromPoint(x, Y)" method to return the DOM node located at the coordinates x,y.

so in that situation i want to hightlight the map area using hightlight function . like https://dl.dropbox.com/u/51378137/game.jpg

var img = $('#theImg'); img.mapster({ mapScale: true, mapKey: 'data-full', isSelectable: true, isDeselectable: true, singleSelect: true,
fillColor: 'ff0000', stroke: true, strokeColor: '00ff00', strokeWidth: 2, fillOpacity: 0.8, strokeOpacity: 0.7, }); //close mapster

// Dragging Code $('.dragstate').css('z-index', 20).draggable({ drag: function (e, ui) { $(this).css('z-index', 20); var TipPos = $(this).offset(), // Track the Position of Dragged Element. Scrolling is not considered here. ElementAtTip = document.elementFromPoint(TipPos.left - 1, TipPos.top - ($(window).scrollTop()) + 10); img.mapster('highlight', false); // Remove the highlighting while dragging to avoid confusion $(ElementAtTip).mapster('highlight', true); // Highlighting the hotspot which below at tip }, containment: ".ui-page", revert: false });

//Dropping Code img.droppable({ drop: function (e, ui) { $(ui.draggable).css('z-index', 20); var TipPos = $(ui.draggable).offset(), // Track the Position of Dragged Element. Scrolling is not considered here. newX = TipPos.left - 1, newY = TipPos.top - (($(window).scrollTop()) - 10), ElementAtTip = document.elementFromPoint(newX, newY), DroppedAreaName = $(ElementAtTip).attr('data-full'), DraggedLabelName = $(ui.draggable).attr('data-full'); if (DroppedAreaName != null ) { checkAnswer(DraggedLabelName, DroppedAreaName);
}
} });

its, highlighting , for each area highlighting has increasing android RAM Memory.. this is my issue.

[rishiphp]

Hi,

We're Successfully resolved memory issue and now the product has out.

https://play.google.com/store/apps/details?id=com.playply.bioiq

Its free one only, just try this and please give some feed. Once again thanks for your plugin.

[jamietre]

I just downloaded and am playing it on my android, it works great! That is so cool! And, I suck at biology.

Can I link it from the "In the Wild" section?

[rishiphp]

Thanks,

"link it from the "In the Wild" section?

[jamietre]

Haha sorry - I mean put it on the web site: http://www.outsharked.com/imagemapster/default.aspx?wild.html

[rishiphp]

Ya.. Welcome.. You Publish it, In Wild Section..!