Public
Edited
May 26
Insert cell
Insert cell
Insert cell
Insert cell
data = m.ask('get_view_table_attribute', {idView: idView})
Insert cell
Insert cell
data_by_basin = d3.group(data, d => d.mj_basin__);
Insert cell
Insert cell
basin = Generators.observe(notify => {
notify("");
m.on('click_attributes', (o) => {
let b = o.attributes[0];
notify(b.basin_name);
});
})
Insert cell
Insert cell
data_clicked = {
let d_sorted;
if (basin && data_by_basin.get(basin)) {
let d = data_by_basin.get(basin);
d_sorted = d.sort((v1, v2) => v1.hectares - v2.hectares);
}
return d_sorted;
}
Insert cell
Insert cell
{
let out = 0;
if (data_clicked) {
let chart_option = {
title: {
text: basin,
},
grid: {
left: '0%',
right: '0%',
top: '10%',
bottom: '0%',
containLabel: true
},
yAxis: {
data: data_clicked.map(v => v.ws_name_f_),
},
xAxis: {
},
series: [{
data: data_clicked.map(v => v.hectares),
type: 'bar',
color: 'green'
}]
};
chart.setOption(chart_option);
out = data_clicked.length;
}
return out;
}
Insert cell
Insert cell
Insert cell
getStyle()
Insert cell
m = newMapxManager('https://app.mapx.org/?lockProject=true&project=MX-6ZH-Y46-C7I-AD5-IO1', 'mapx')
Insert cell
Insert cell
Insert cell
chart = {
let chart = echarts.init(document.getElementById('chart'));
window.addEventListener('resize', function(event){
chart.resize();
});
return chart;
}
Insert cell
idView = 'MX-DY6K5-K1YZ0-VLP6A'
Insert cell
{
m.ask('set_panel_left_visibility', {
panel: 'views',
show: false,
});
m.ask('view_add', {idView: idView});
m.ask('set_features_click_sdk_only', {enable: true})
}
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more