Not all coordinates with arrays being drawn to screen and lines flicker after screen cleared.

Here is an example of the resources I load (Ignore that the arrays are the same, it is just an example)

I use menu 2 to fetch the ids as an array

function onSelect{

if (such n such){

Map = [:data1,:data2,:data3];

}

Load and draw a different part each update:

function loadMapResource() {
System.println("load1");
if (Map != null){
System.println("load2 ");
MapArr = WatchUi.loadResource(Rez.JsonData[Map[NumPick]]);
WatchUi.requestUpdate();
}
}

function onUpdate(dc) {

var py = null;
var px = null;
var pyOld = null;
var pxOld = null;
var heading2 = Sensor.getInfo().heading;
if (m != null){
if (MapArr != null) {
m = m.toDegrees();
dc.clearClip();
for (var i=0; i<MapArr.size();i++){
var arr = MapArr[i];
for (var j=0; j<arr.size() - 2;j+=2){
var long = arr[j];
var lat = arr[j+1];
var pixelsLon = (long - m[1]) * zoom + (gw/2);
var pixelsLat = (m[0] - lat) * zoom + (gh/2);
py = pixelsLat.toNumber();
px = pixelsLon.toNumber();
var pyRot = Math.sin(heading2) * (px - 120) - Math.cos(heading2) * (py - 120) + 120;
var pxRot = Math.cos(heading2) * (px - 120) - Math.sin(heading2) * (py - 120) + 120;
if (pxOld != null){
dc.setPenWidth(3);
if (j==0){
dc.setColor(Graphics.COLOR_TRANSPARENT,Graphics.COLOR_TRANSPARENT);}
else if (j > 0) {
dc.setColor(Graphics.COLOR_GREEN, Graphics.COLOR_TRANSPARENT);}
dc.drawLine(pxOld, pyOld, px,py);
}
pxOld = px;
pyOld = py;
}
if (i == MapArr.size() - 1){
if (NumPick != Map.size() - 1){
NumPick = NumPick + 1;}
else if (NumPick == Map.size() - 1 && i == MapArr.size() - 1){
NumPick = 0;
dc.clearClip();
dc.setColor(Graphics.COLOR_BLACK, Graphics.COLOR_BLACK);
dc.clear();
dc.setColor(Graphics.COLOR_TRANSPARENT, Graphics.COLOR_BLACK);
}
dc.setClip(0, 0, gw, 40);
MapviewerView.loadMapResource();
}
}
}
}
}
As you can see the orangey brown line image is the desired look,
the gif is what I get:

0 Scarecrow123 over 2 years ago

Apologies that the gif is huge, i'm unsure why that is

0 Scarecrow123 over 2 years ago in reply to Scarecrow123

Also this image gets cut off on mobile so i'll place it here

0 jim_m_58 over 2 years ago in reply to Scarecrow123

If you comment out all the setClip(), clearClip(). and clear() calls, how does it look?

0 Scarecrow123 over 2 years ago in reply to jim_m_58

So I did two tests: First before I did your suggestion I changed where it says if (i == MapArr.size()) - 1) to if (i == MapArr.size()) whereupon the map now shows the missing part but not the other parts. However then I also did what you said and got the same result.

0 Scarecrow123 over 2 years ago in reply to jim_m_58

I fixed it, I moved the loadMapResource code to onUpdate and changed the setClip() to be set if the map wasn't fully drawn before the screen was cleared then clearClip() after the screen has cleared. There was something funny going on where the separate function for loading the resource wasn't working.

It is a bit slower now though so perhaps it's a temporary fix.

function onUpdate(dc) {

View.onUpdate(dc);

var gw = dc.getWidth(),gh = dc.getHeight(); dc.setColor(Graphics.COLOR_BLACK, Graphics.COLOR_BLACK); dc.clear();

dc.setColor(Graphics.COLOR_TRANSPARENT, Graphics.COLOR_BLACK); dc.clearClip(); var m =

Position.getInfo().position;

var py = null; var px = null; var pyOld = null; var pxOld = null;

var heading2 = Sensor.getInfo().heading;

if (Map != null){ MapArr = WatchUi.loadResource(Rez.JsonData[Map[NumPick]]); }

if (m != null){

if (MapArr != null) {

m = m.toDegrees();

for (var i=0; i<MapArr.size();i++)

{ var arr = MapArr[i];

for (var j=0; j<arr.size() - 2;j+=2)

{ var long = arr[j]; var lat = arr[j+1];

var pixelsLon = (long - m[1]) * zoom + (gw/2);

var pixelsLat = (m[0] - lat) * zoom + (gh/2);

py = pixelsLat.toNumber();

px = pixelsLon.toNumber();

var pyRot = Math.sin(heading2) * (px - 120) - Math.cos(heading2) * (py - 120) + 120;

var pxRot = Math.cos(heading2) * (px - 120) - Math.sin(heading2) * (py - 120) + 120; dc.setColor(Graphics.COLOR_GREEN, Graphics.COLOR_TRANSPARENT);

if (pxOld != null){ dc.setPenWidth(3); if (j==0){ dc.setColor(Graphics.COLOR_TRANSPARENT,Graphics.COLOR_TRANSPARENT);}

else if (j > 0) { dc.setColor(Graphics.COLOR_GREEN, Graphics.COLOR_TRANSPARENT);}

dc.drawLine(pxOld, pyOld, px,py); } pxOld = px; pyOld = py; }

if (i == (MapArr.size() - 1)){

if (NumPick != (Map.size() - 1)){ NumPick = NumPick + 1; dc.setClip(0, 0, gw, 40);}

else if (NumPick == (Map.size() - 1) && i == (MapArr.size() - 1)){ NumPick = 0; //dc.clearClip(); } } } } }