We Keep Coding

User memory limit exceeded in GEE

I started using GEE recently. I wanted to apply the non-parametric Mann-Kendall method to a collection of Sentinel-1 images. However there is a memory error in the code and this is my problem. Link code:https://code.earthengine.google.com/4bf1dbbcd116c8e3f5c584fbb45e8c19
var quadricula = ee.Geometry.Polygon([[-51.20732599322313,-15.60026586116677],[-51.20732599322313,-15.455379154650098],[-51.262600956602036,-15.455379154650098],[-51.262600956602036,-15.60026586116677]]);
//Map.addLayer(quadricula);
// Filter collection to dates of interest.
var Sentinel1 = ee.ImageCollection('COPERNICUS/S1_GRD')
.filterDate('2015-01-01', '2022-01-01')
.filterBounds(quadricula);
print('Quantidade de imagens no intervalo definido:',Sentinel1.size());
//===========================================================================//
var wrapper = require('users/adugnagirma/gee_s1_ard:wrapper');
var helper = require('users/adugnagirma/gee_s1_ard:utilities');
//---------------------------------------------------------------------------//
// DEFINE PARAMETERS
//---------------------------------------------------------------------------//
//var geometry = ee.Geometry.Polygon([[-51.20732599322313,-15.60026586116677],[-51.20732599322313,-15.455379154650098],[-51.262600956602036,-15.455379154650098],[-51.262600956602036,-15.60026586116677]]);
//Map.addLayer(geometry);
var parameter = {//1. Data Selection
START_DATE: "2015-01-01",
STOP_DATE: "2022-01-01",
POLARIZATION:'VVVH',
ORBIT : 'BOTH',
GEOMETRY: quadricula, //uncomment if interactively selecting a region of interest
//GEOMETRY: ee.Geometry.Polygon([[[104.80, 11.61],[104.80, 11.36],[105.16, 11.36],[105.16, 11.61]]], null, false), //Uncomment if providing coordinates
//GEOMETRY: ee.Geometry.Polygon([[[112.05, -0.25],[112.05, -0.45],[112.25, -0.45],[112.25, -0.25]]], null, false),
//2. Additional Border noise correction
APPLY_ADDITIONAL_BORDER_NOISE_CORRECTION: true,
//3.Speckle filter
APPLY_SPECKLE_FILTERING: true,
SPECKLE_FILTER_FRAMEWORK: 'MULTI',
SPECKLE_FILTER: 'REFINED LEE',
SPECKLE_FILTER_KERNEL_SIZE: 5,
SPECKLE_FILTER_NR_OF_IMAGES: 10,
//4. Radiometric terrain normalization
APPLY_TERRAIN_FLATTENING: true,
DEM: ee.Image('NASA/NASADEM_HGT/001'),
TERRAIN_FLATTENING_MODEL: 'VOLUME',
TERRAIN_FLATTENING_ADDITIONAL_LAYOVER_SHADOW_BUFFER: 0,
//5. Output
FORMAT : 'DB',
CLIP_TO_ROI: true,
SAVE_ASSETS: false
};
//---------------------------------------------------------------------------//
// DO THE JOB
//---------------------------------------------------------------------------//
//Preprocess the S1 collection
var s1_preprocces = wrapper.s1_preproc(parameter);
var s1 = s1_preprocces[0];
s1_preprocces = s1_preprocces[1];
//---------------------------------------------------------------------------//
// VISUALIZE
//---------------------------------------------------------------------------//
//Visulaization of the first image in the collection in RGB for VV, VH, images
var visparam = {};
if (parameter.POLARIZATION=='VVVH'){
if (parameter.FORMAT=='DB'){
var s1_preprocces_view = s1_preprocces.map(helper.add_ratio_lin).map(helper.lin_to_db2);
var s1_view = s1.map(helper.add_ratio_lin).map(helper.lin_to_db2);
visparam = {bands:['VV','VH','VVVH_ratio'],min: [-20, -25, 1],max: [0, -5, 15]};
}
else {
var s1_preprocces_view = s1_preprocces.map(helper.add_ratio_lin);
var s1_view = s1.map(helper.add_ratio_lin);
visparam = {bands:['VV','VH','VVVH_ratio'], min: [0.01, 0.0032, 1.25],max: [1, 0.31, 31.62]};
}
}
else {
if (parameter.FORMAT=='DB') {
s1_preprocces_view = s1_preprocces.map(helper.lin_to_db);
s1_view = s1.map(helper.lin_to_db);
visparam = {bands:[parameter.POLARIZATION],min: -25,max: 0} ;
}
else {
s1_preprocces_view = s1_preprocces;
s1_view = s1;
visparam = {bands:[parameter.POLARIZATION],min: 0,max: 0.2};
}
}
// Calcula o MRFDI
var MRFDI = s1_preprocces.map(function(image) {
return image.normalizedDifference(['VV', 'VH']).rename('MRFDI');
});
var addMRFDI = function (image) {
var MRFDI = image.expression('(VV - VH)/(VV + VH)', {
'VV' : image.select('VV'),
'VH' : image.select('VH'),
}).float();
return image.addBands(MRFDI.rename('MRFDI'));
};
var MRFDI = s1_preprocces.map(addMRFDI)
.select('MRFDI');
// Calcula o RVI
var RVI = s1_preprocces.map(function(image) {
return image.normalizedDifference(['VV', 'VH']).rename('RVI');
});
var addRVI = function (image) {
var RVI = image.expression('(4*VH)/(VV + VH)', {
'VV' : image.select('VV'),
'VH' : image.select('VH'),
}).float();
return image.addBands(RVI.rename('RVI'));
};
var RVI = s1_preprocces.map(addRVI)
.select('RVI');
Map.centerObject(parameter.GEOMETRY, 12);
Map.addLayer(s1_view.first(), visparam, 'First image in the input S1 collection', true);
Map.addLayer(s1_preprocces_view.first(), visparam, 'First image in the processed S1 collection', true);
//---------------------------------------------------------------------------//
// EXPORT
//---------------------------------------------------------------------------//
//Convert format for export
if (parameter.FORMAT=='DB'){
s1_preprocces = s1_preprocces.map(helper.lin_to_db);
}
//Save processed collection to asset
if(parameter.SAVE_ASSETS) {
helper.Download.ImageCollection.toAsset(s1_preprocces, '',
{scale: 10,
region: s1_preprocces.geometry(),
type: 'float'});
}
print('Quantidade de imagens s1_preprocces:',s1_preprocces.size());
// Define an image collection time series to chart, MODIS vegetation indices
// in this case.
var imgCol = s1_preprocces
.select(['VV', 'VH']);
//=================================================================================//
//mann-kendall
var coll = s1_preprocces.map(function(image) {
return image.select().addBands(image.normalizedDifference(['VH', 'VV']));
})
.filter(ee.Filter.calendarRange(8, 9, 'month'));
Map.addLayer(coll, {}, 'coll');
var afterFilter = ee.Filter.lessThan({
leftField: 'system:time_start',
rightField: 'system:time_start'
});
var joined = ee.ImageCollection(ee.Join.saveAll('after').apply({
primary: coll,
secondary: coll,
condition: afterFilter
}));
var sign = function(i, j) { // i and j are images
return ee.Image(j).neq(i) // Zero case
.multiply(ee.Image(j).subtract(i).clamp(-1, 1)).int();
};
var kendall = ee.ImageCollection(joined.map(function(current) {
var afterCollection = ee.ImageCollection.fromImages(current.get('after'));
return afterCollection.map(function(image) {
// The unmask is to prevent accumulation of masked pixels that
// result from the undefined case of when either current or image
// is masked. It won't affect the sum, since it's unmasked to zero.
return ee.Image(sign(current, image)).unmask(0);
});
// Set parallelScale to avoid User memory limit exceeded.
}).flatten()).reduce('sum', 2);
var palette_sens = {min: -0.001, max: 0.001, palette: [
'red', 'white', 'green']};
var palette = ['red', 'white', 'green'];
// Stretch this as necessary.g
Map.addLayer(kendall, {palette: palette}, 'kendall');
var slope = function(i, j) { // i and j are images
return ee.Image(j).subtract(i)
.divide(ee.Image(j).date().difference(ee.Image(i).date(), 'days'))
.rename('slope')
.float();
};
var slopes = ee.ImageCollection(joined.map(function(current) {
var afterCollection = ee.ImageCollection.fromImages(current.get('after'));
return afterCollection.map(function(image) {
return ee.Image(slope(current, image));
});
}).flatten());
var sensSlope = slopes.reduce(ee.Reducer.median(), 2); // Set parallelScale.
Map.addLayer(sensSlope, palette_sens, 'sensSlope');
var epochDate = ee.Date('1970-01-01');
var sensIntercept = coll.map(function(image) {
var epochDays = image.date().difference(epochDate, 'days').float();
return image.subtract(sensSlope.multiply(epochDays)).float();
}).reduce(ee.Reducer.median(), 2);
Map.addLayer(sensIntercept, {}, 'sensIntercept');
Map.addLayer(table, {color: 'blue'});
I hope to resolve this impasse without changing the adopted time interval and reducing the size of the study area.

Chart.js How to sum the values in a pie chart and display them in the header

I have a pie chart that shows how many people have registered by area. What I need to do is sum the pie slices and display the total in the header/title of the pie chart.
I am using chart.js and c#.
Data
Area People Registered
BBB 618
GG 1186
KK 575
HTC 630
This is my code so far.
#Scripts.Render("~/bundles/chartjs")
<script type="text/javascript">
var seriesColors = [
"#5b9bd5", "#a5a5a5", "#4472c4", "#255e91", "#636363", "#264478", "#7cafdd", "#335aa1", "#698ed0",
"#327dc2", "#848484"
];
var quorumData = [];
var prisecData = [];
//var raincheckData = [];
var groupData = defineGroupDataArray();
//var percent = defineGroupDataArray();
var barData = defineBarDataArray();
$(function() {
// Global Chart Options
Chart.defaults.global.tooltips.mode = "label";
Chart.defaults.global.legend.display = false;
Chart.defaults.global.maintainAspectRatio = true;
// Pie Chart Options
Chart.defaults.pie.segmentShowStroke = true;
// Bar Chart Options
Chart.defaults.bar.scaleBeginAtZero = false;
updateQuorumChart(true);
updateGroupCharts(true);
setInterval(function() {
updateQuorumChart(false),
updateGroupCharts(false);
},
5000);
});
function defineGroupDataArray() {
return {
labels: [],
datasets: [
{
data: [],
backgroundColor: []
}
]
};
};
function drawAttendByAreaChart(animate, quorumData) {
$("#attendbyarea").remove();
$("#attendbyarea-container").append('<canvas id="attendbyarea"></canvas>');
$("#attendbyarea-header").text("Attendees by Area ("+ + ")");
var context = $("#attendbyarea");
var chart = new Chart(context,
{
type: 'pie',
data: groupData,
options: {
animation: {
animateRotate: animate,
animateScale: animate
}
}
});
};
function updateGroupCharts(animate) {
$.getJSON('#Url.Action("GetGroupStatistics", "Account")',
null,
function (result, quorumData) { onUpdateGroupCharts(animate, result) });
};
function onUpdateGroupCharts(animate, result) {
$.each(result,
function(groupIndex, groupValue) {
groupData = defineGroupDataArray();
$.each(groupValue.Data,
function(statIndex, statValue) {
groupData.labels.push(statValue.Description);
groupData.datasets[0].data.push(statValue.Count);
groupData.datasets[0].backgroundColor.push(seriesColors[statIndex]);
});
switch (groupValue.Type) {
case 0:
drawRegByAreaChart(animate);
break;
case 1:
groupData = defineGroupDataArray();
$.each(groupValue.Data,
function(statIndex, statValue) {
groupData.labels.push(statValue.Description +
': ' + statValue.Count +' (' + statValue.ToolTip);
groupData.datasets[0].data.push(statValue.Count);
groupData.datasets[0].backgroundColor.push(seriesColors[statIndex]);
});
drawRegByDistrictChart(animate);
break;
case 2:
barData = defineBarDataArray();
$.each(groupData.datasets[0].data,
function(barIndex, barValue) {
//barData.labels.push(groupData.labels[barIndex]);
barData.datasets[0].data.push(barValue);
});
drawRegByHourChart(animate);
break;
case 3:
drawRegByEmpChart(animate);
break;
case 4:
drawAttendByAreaChart(animate);
break;
}
});
};
</script>
}
In the image below I need the total which is 3,009 to be displayed beside Attendees by Area.
Pie Chart

Figured it out. I used a function to add all the values for people registered and then passed that to my function that draws the pie chart.
In my case statment:
case 4:
groupData = defineGroupDataArray();
var totalAttendees = 0;
$.each(groupValue.Data,
function(statIndex, statValue) {
groupData.labels.push(statValue.Description);
groupData.datasets[0].data.push(statValue.Count);
groupData.datasets[0].backgroundColor.push(seriesColors[statIndex]);
totalAttendees += statValue.Count;
});
drawAttendeesByAreaChart(animate,totalAttendees);
break;
In the draw chart function:
function drawAttendeesByAreaChart(animate,totalAttendees) {
$("#attendbyarea").remove();
$("#attendbyarea-container").append('<canvas id="attendbyarea"></canvas>');
$("#attendbyarea-header").text("Attendees by Area ("+ $.number(totalAttendees) +")");
...rest of code...
};

Highchart always download PNG images?

I combined two charts together to export both charts.
<script defer="true"><![CDATA[
(function(){
var exportChart = function() {
Highcharts.getSVG = function(charts) {
var svgArr = [], top = 0, width = 0;
jq.each(charts, function(i, chart) {
var svg = chart.getSVG();
svg = svg.replace('<svg', '<g transform="translate(0,' + top
+ ')" ');
svg = svg.replace('</svg>', '</g>');
top += chart.chartHeight;
width = Math.max(width, chart.chartWidth);
svgArr.push(svg);
});
return '<svg height="' + top + '" width="' + width
+ '" version="1.1" xmlns="http://www.w3.org/2000/svg">'
+ svgArr.join('') + '</svg>';
};
Highcharts.exportCharts = function() {
var charts = [];
jq(".test-timeline-chart .highcharts-container")
.each(
function(i, e) {
charts
.push(Highcharts.charts[jq(e).parent()
.data().highchartsChart]);
});
var form;
svg = Highcharts.getSVG(charts);
// merge the options
var options = Highcharts.merge(Highcharts.getOptions().exporting, {});
// create the form
form = Highcharts.createElement('form', {
method : 'post',
action : options.url
}, {
display : 'none'
}, document.body);
// add the values
Highcharts.each([ 'filename', 'type', 'width', 'svg' ], function(name) {
Highcharts.createElement('input', {
type : 'hidden',
name : name,
value : {
filename : options.filename || 'chart',
type : options.type,
width : options.width,
svg : svg
}[name]
}, null, form);
});
// submit
form.submit();
// clean up
form.parentNode.removeChild(form);
};
// printing all the charts in single page.
function printAll() {
var origDisplay = [], origParent = [], body = document.body, childNodes = body.childNodes;
// hide all body content
Highcharts.each(childNodes, function(node, i) {
if (node.nodeType === 1) {
origDisplay[i] = node.style.display;
node.style.display = "none";
}
});
var charts = [];
jq(".test-timeline-chart .highcharts-container")
.each(
function(i, e) {
charts
.push(Highcharts.charts[jq(e).parent()
.data().highchartsChart]);
});
// put the charts back in
jq.each(charts, function(i, chart) {
origParent[i] = chart.container.parentNode;
body.appendChild(chart.container);
});
// print
window.print();
// allow the browser to prepare before reverting
setTimeout(function() {
// put the chart back in
jq.each(charts, function(i, chart) {
origParent[i].appendChild(chart.container);
});
// restore all body content
Highcharts.each(childNodes, function(node, i) {
if (node.nodeType === 1) {
node.style.display = origDisplay[i];
}
});
}, 500);
}
if(jq(".test-timeline-chart").length > 0) {
var index = jq(".test-timeline-chart .highcharts-container:first").parent().data().highchartsChart;
var instanceChart = Highcharts.charts[index+1];
instanceChart.exportChart = Highcharts.exportCharts;
instanceChart.options.exporting.buttons.contextButton.menuItems[0].onclick = function() {
printAll();
};
};
};
exportChart();
})();
]]>
</script>
The var options = Highcharts.merge(Highcharts.getOptions().exporting, {}); always returing the PNG image and the export chart option always download PNG images. How I can fix this?
I found a way to listen to the onclick event of high chart context menu items. Is there a way to get selected items?

How to display custom tooltips on line chart using Rickshaw Library

I am developing a realtime graph system which will display the memory usage at particular time using data from json file . I am using Rickshaw Library which accepts tool tip in numeric type else the hard coded value supplied as a property to graph .
I have a json object as :
[
{
"memory": 444.08203125,
"memoryInfo": {
"rss": 444.08203125,
"vsize": 1271.125
},
"cpu": 0.2,
"url": [
"/admin/company/approved"
],
"time": "2/12/2016, 10:42:09 AM"
},
...
...
]
I want to show in tool tip at particular time what was the url served by server so that i can get proper information like which route is consuming more memory.
I will share my so far js code with you so that it will be better to understand .
script.js
$(function(){
var json = null;
console.log("Document Ready");
$.ajax({
url: 'data.json',
type: 'get',
success: function (data) {
console.log("Got data");
json = data
drawGraph()
}
});
var interval = 250;
//function to use from populating new values to graph
var getMemory = function(index) {
return json[index].memory
}
var getUrl = function(index) {
return json[index].url[0]
}
var getToolTip = function(){
console.log("getting tooltip")
return "api/login"
}
var drawGraph = function(){
// instantiate our graph!
graph = new Rickshaw.Graph( {
element: document.getElementById("chart"),
width: 900,
height: 400,
renderer: 'line',
interpolate:'basis',
series: new Rickshaw.Series.FixedDuration([{ name: 'memory' ,color:'steelblue',tooltip:"/api/login"}], undefined, {
timeInterval: interval,
maxDataPoints: 500,
timeBase: new Date().getTime() / 1000,
})
})
//tooltip is hardcoded should be dynamic when fetching each object from json
graph.render();
// get Recent log data using socket and feed it to graph
var i = 0;
var iv = setInterval( function() {
i++
var data = { memory: getMemory(i)};
graph.series.addData(data);
graph.render();
}, interval );
//hover details
var hoverDetail = new Rickshaw.Graph.HoverDetail( {
graph: graph,
formatter: function(series, x, y) {
var date = '<span class="date">' + new Date(x * 1000).toUTCString() + '</span>';
var swatch = '<span class="detail_swatch" style="background-color: ' + series.color + '"></span>';
var content = swatch + series.tooltip + ": " + parseInt(y) + '<br>' + date;
console.log(series)
return content;
}
});
}
});//jQuery

Can you give us some further information regarding your problem/error?
From a quick look that I had, your tooltips (Rickshaw.Graph.HoverDetail) won't be able to render because you are asking in formatter for inputs "series,x,y" and you haven't set each element of the data array to have a x and y value.
example:
data: [ { x: 0, y: 5 }, { x: 1, y: 10 } ]
Take a look at rickshaw example here.

plotting realtime data and turning on and off data series using flot api

I am using flot charts. I want to plot chart which is updated per second and also want to add the feature of turning off and on the data series.
I am able to make it work but has problems which I did not expect, like color of one series change when other series is turned off; other is when I update the array of data series the charts seems to move but it removes element from the right,at the same time the new value is plotted on the right hand side ...
var d1 = [] ;
var d2 = [] ;
var d3 = [] ;
$(function(){
{%for reading in readings%}
var time_stamp = parseFloat({{reading['timestamp']}} + 19800.00) * 1000
var A = parseFloat({{reading['values']['A']}}) ;
var V = parseFloat({{reading['values']['VLN']}}) - 50 ;
var W = parseFloat({{reading['values']['W']}}) / 1000 ;
d1.push([time_stamp,A]);
d2.push([time_stamp,V]);
d3.push([time_stamp,W]);
{%endfor%}
var datasets = {
"current":{
label : "A",
data : d1
},
"voltage":{
label : "V",
data : d2
},
"power":{
label : "W",
data : d3
},
}
var i = 0;
$.each(datasets, function(key, val) {
val.color = i;
++i;
});
// insert checkboxes
var choiceContainer = $("#choices");
$.each(datasets, function(key, val) {
choiceContainer.append("<br/><input type='checkbox' name='" + key +
"' checked='checked' id='id" + key + "'></input>" +
"<label for='id" + key + "'>"
+ val.label + "</label>");
});
choiceContainer.find("input").click(plotAccordingToChoices);
function plotAccordingToChoices() {
var data = [];
choiceContainer.find("input:checked").each(function () {
var key = $(this).attr("name");
if (key && datasets[key]) {
data.push(datasets[key]);
}
});
if (data.length > 0) {
$.plot("#placeholder", data, {
series: {
shadowSize: 0,
lines: {
show: true
},
},
yaxis: {
min: 0
},
xaxis: {
tickDecimals: 0,
mode:"time"
}
});
}
setTimeout(getNextDataset,1000);
}
plotAccordingToChoices();
});
function getNextDataset()
{
$.ajax({url : '/newdata' , success:function(result){
reading =JSON.parse(result);
var time_stamp = (parseFloat(reading.timestamp) + 19800.00) * 1000
var A = parseFloat(reading.values.A) ;
var W = parseFloat(reading.values.W) / 1000 ;
var V = parseFloat(reading.values.VLN) - 50 ;
d1.shift();d2.shift();d3.shift();
d1.push([time_stamp,A]);
d2.push([time_stamp,V]);
d3.push([time_stamp,W]);
var datasets = {
"current":{
label : "A",
data : d1
},
"voltage":{
label : "V",
data : d2
},
"power":{
label : "W",
data : d3
},
}
var data = [] ;
var choiceContainer = $("#choices");
choiceContainer.find("input:checked").each(function () {
var key = $(this).attr("name");
if (key && datasets[key]) {
data.push(datasets[key]);
}
});
if (data.length > 0) {
$.plot("#placeholder", data, {
series: {
shadowSize: 0,
lines: {
show: true
},
points:{
show:false
},
},
yaxis: {
min: 0
},
xaxis: {
tickDecimals: 0,
mode:"time"
}
});
}
}
});
setTimeout(getNextDataset,1000) ;
}
`
I am making use of code available in flot charts examples.Where am I going wrong ??
Thank you ?

Problem 1 : Color updating every time a checkbox was checked or unchecked
Reason: Every time the checkbox click event was triggered,some how the color used to get updated
Solution : Removed setTimeout(getNextDataset,1000); call from the function plotAccordingToChoices()
Problem 2: The data elements are removed from the right instead of left.
Reason : (Very dumb) Data was coming in descending order and I was using pushing data in that order only.So latest point was at location 0 of the array and oldest point was at location n-1.And I was removing (n-1)th point.
Solution : Replaced push in the beginning with unshift().Did the magic :P