forked from ScoDoc/ScoDoc
js code format
This commit is contained in:
parent
e918b5bcb4
commit
7b62ab8784
@ -4,135 +4,165 @@
|
||||
// console.log('etud_debouche.js loaded');
|
||||
|
||||
$(function () {
|
||||
display_itemsuivis(false);
|
||||
display_itemsuivis(false);
|
||||
});
|
||||
|
||||
|
||||
function display_itemsuivis(active) {
|
||||
var etudid = $('div#fichedebouche').data("etudid");
|
||||
var readonly = $('div#fichedebouche').data('readonly'); // present ro interface
|
||||
var etudid = $("div#fichedebouche").data("etudid");
|
||||
var readonly = $("div#fichedebouche").data("readonly"); // present ro interface
|
||||
|
||||
if (!readonly) {
|
||||
$('#adddebouchelink').off("click").click(function (e) {
|
||||
e.preventDefault();
|
||||
$.post(SCO_URL + "/itemsuivi_create", { etudid: etudid, format: 'json' }).done(item_insert_new);
|
||||
if (!readonly) {
|
||||
$("#adddebouchelink")
|
||||
.off("click")
|
||||
.click(function (e) {
|
||||
e.preventDefault();
|
||||
$.post(SCO_URL + "/itemsuivi_create", {
|
||||
etudid: etudid,
|
||||
fmt: "json",
|
||||
}).done(item_insert_new);
|
||||
|
||||
return false;
|
||||
});
|
||||
return false;
|
||||
});
|
||||
}
|
||||
// add existing items
|
||||
$.get(
|
||||
SCO_URL + "/itemsuivi_list_etud",
|
||||
{ etudid: etudid, fmt: "json" },
|
||||
function (L) {
|
||||
for (var i in L) {
|
||||
item_insert(
|
||||
L[i]["itemsuivi_id"],
|
||||
L[i]["item_date"],
|
||||
L[i]["situation"],
|
||||
L[i]["tags"],
|
||||
readonly
|
||||
);
|
||||
}
|
||||
}
|
||||
// add existing items
|
||||
$.get(SCO_URL + "/itemsuivi_list_etud", { etudid: etudid, format: 'json' }, function (L) {
|
||||
for (var i in L) {
|
||||
item_insert(L[i]['itemsuivi_id'], L[i]['item_date'], L[i]['situation'], L[i]['tags'], readonly);
|
||||
}
|
||||
});
|
||||
);
|
||||
|
||||
$("div#fichedebouche").accordion({
|
||||
heightStyle: "content",
|
||||
collapsible: true,
|
||||
active: active,
|
||||
});
|
||||
$("div#fichedebouche").accordion({
|
||||
heightStyle: "content",
|
||||
collapsible: true,
|
||||
active: active,
|
||||
});
|
||||
}
|
||||
|
||||
function item_insert_new(it) {
|
||||
item_insert(it.itemsuivi_id, it.item_date, it.situation, '', false);
|
||||
item_insert(it.itemsuivi_id, it.item_date, it.situation, "", false);
|
||||
}
|
||||
|
||||
function item_insert(itemsuivi_id, item_date, situation, tags, readonly) {
|
||||
if (item_date === undefined)
|
||||
item_date = Date2DMY(new Date());
|
||||
if (situation === undefined)
|
||||
situation = '';
|
||||
if (tags === undefined)
|
||||
tags = '';
|
||||
if (item_date === undefined) item_date = Date2DMY(new Date());
|
||||
if (situation === undefined) situation = "";
|
||||
if (tags === undefined) tags = "";
|
||||
|
||||
var nodes = item_nodes(itemsuivi_id, item_date, situation, tags, readonly);
|
||||
// insert just before last li:
|
||||
if ($('ul.listdebouches li.adddebouche').length > 0) {
|
||||
$('ul.listdebouches').children(':last').before(nodes);
|
||||
} else {
|
||||
// mode readonly, pas de li "ajouter"
|
||||
$('ul.listdebouches').append(nodes);
|
||||
}
|
||||
};
|
||||
var nodes = item_nodes(itemsuivi_id, item_date, situation, tags, readonly);
|
||||
// insert just before last li:
|
||||
if ($("ul.listdebouches li.adddebouche").length > 0) {
|
||||
$("ul.listdebouches").children(":last").before(nodes);
|
||||
} else {
|
||||
// mode readonly, pas de li "ajouter"
|
||||
$("ul.listdebouches").append(nodes);
|
||||
}
|
||||
}
|
||||
|
||||
function item_nodes(itemsuivi_id, item_date, situation, tags, readonly) {
|
||||
// console.log('item_nodes: itemsuivi_id=' + itemsuivi_id);
|
||||
var sel_mois = 'Situation à la date du <input type="text" class="itemsuividatepicker" size="10" value="' + item_date + '"/><span class="itemsuivi_suppress" onclick="itemsuivi_suppress(\'' + itemsuivi_id + '\')"><img width="10" height="9" border="0" title="" alt="supprimer cet item" src="/ScoDoc/static/icons/delete_small_img.png"/></span>';
|
||||
// console.log('item_nodes: itemsuivi_id=' + itemsuivi_id);
|
||||
var sel_mois =
|
||||
'Situation à la date du <input type="text" class="itemsuividatepicker" size="10" value="' +
|
||||
item_date +
|
||||
'"/><span class="itemsuivi_suppress" onclick="itemsuivi_suppress(\'' +
|
||||
itemsuivi_id +
|
||||
'\')"><img width="10" height="9" border="0" title="" alt="supprimer cet item" src="/ScoDoc/static/icons/delete_small_img.png"/></span>';
|
||||
|
||||
var h = sel_mois;
|
||||
// situation
|
||||
h += '<div class="itemsituation editable" data-type="textarea" data-url="itemsuivi_set_situation" data-placeholder="<em>décrire situation...</em>" data-object="' + itemsuivi_id + '">' + situation + '</div>';
|
||||
// tags:
|
||||
h += '<div class="itemsuivi_tag_edit"><textarea class="itemsuivi_tag_editor">' + tags + '</textarea></div>';
|
||||
var h = sel_mois;
|
||||
// situation
|
||||
h +=
|
||||
'<div class="itemsituation editable" data-type="textarea" data-url="itemsuivi_set_situation" data-placeholder="<em>décrire situation...</em>" data-object="' +
|
||||
itemsuivi_id +
|
||||
'">' +
|
||||
situation +
|
||||
"</div>";
|
||||
// tags:
|
||||
h +=
|
||||
'<div class="itemsuivi_tag_edit"><textarea class="itemsuivi_tag_editor">' +
|
||||
tags +
|
||||
"</textarea></div>";
|
||||
|
||||
var nodes = $($.parseHTML('<li class="itemsuivi">' + h + '</li>'));
|
||||
var dp = nodes.find('.itemsuividatepicker');
|
||||
dp.blur(function (e) {
|
||||
var date = this.value;
|
||||
// console.log('selected text: ' + date);
|
||||
$.post(SCO_URL + "/itemsuivi_set_date", { item_date: date, itemsuivi_id: itemsuivi_id });
|
||||
var nodes = $($.parseHTML('<li class="itemsuivi">' + h + "</li>"));
|
||||
var dp = nodes.find(".itemsuividatepicker");
|
||||
dp.blur(function (e) {
|
||||
var date = this.value;
|
||||
// console.log('selected text: ' + date);
|
||||
$.post(SCO_URL + "/itemsuivi_set_date", {
|
||||
item_date: date,
|
||||
itemsuivi_id: itemsuivi_id,
|
||||
});
|
||||
dp.datepicker({
|
||||
onSelect: function (date, instance) {
|
||||
// console.log('selected: ' + date + 'for itemsuivi_id ' + itemsuivi_id);
|
||||
$.post(SCO_URL + "/itemsuivi_set_date", { item_date: date, itemsuivi_id: itemsuivi_id });
|
||||
},
|
||||
showOn: 'button',
|
||||
buttonImage: '/ScoDoc/static/icons/calendar_img.png',
|
||||
buttonImageOnly: true,
|
||||
dateFormat: 'dd/mm/yy',
|
||||
duration: 'fast',
|
||||
disabled: readonly
|
||||
});
|
||||
dp.datepicker('option', $.extend({ showMonthAfterYear: false },
|
||||
$.datepicker.regional['fr']));
|
||||
});
|
||||
dp.datepicker({
|
||||
onSelect: function (date, instance) {
|
||||
// console.log('selected: ' + date + 'for itemsuivi_id ' + itemsuivi_id);
|
||||
$.post(SCO_URL + "/itemsuivi_set_date", {
|
||||
item_date: date,
|
||||
itemsuivi_id: itemsuivi_id,
|
||||
});
|
||||
},
|
||||
showOn: "button",
|
||||
buttonImage: "/ScoDoc/static/icons/calendar_img.png",
|
||||
buttonImageOnly: true,
|
||||
dateFormat: "dd/mm/yy",
|
||||
duration: "fast",
|
||||
disabled: readonly,
|
||||
});
|
||||
dp.datepicker(
|
||||
"option",
|
||||
$.extend({ showMonthAfterYear: false }, $.datepicker.regional["fr"])
|
||||
);
|
||||
|
||||
if (readonly) {
|
||||
// show tags read-only
|
||||
readOnlyTags(nodes.find('.itemsuivi_tag_editor'));
|
||||
}
|
||||
else {
|
||||
// bind tag editor
|
||||
nodes.find('.itemsuivi_tag_editor').tagEditor({
|
||||
initialTags: '',
|
||||
placeholder: 'Tags...',
|
||||
onChange: function (field, editor, tags) {
|
||||
$.post('itemsuivi_tag_set',
|
||||
{
|
||||
itemsuivi_id: itemsuivi_id,
|
||||
taglist: tags.join()
|
||||
});
|
||||
},
|
||||
autocomplete: {
|
||||
delay: 200, // ms before suggest
|
||||
position: { collision: 'flip' }, // automatic menu position up/down
|
||||
source: "itemsuivi_tag_search"
|
||||
},
|
||||
if (readonly) {
|
||||
// show tags read-only
|
||||
readOnlyTags(nodes.find(".itemsuivi_tag_editor"));
|
||||
} else {
|
||||
// bind tag editor
|
||||
nodes.find(".itemsuivi_tag_editor").tagEditor({
|
||||
initialTags: "",
|
||||
placeholder: "Tags...",
|
||||
onChange: function (field, editor, tags) {
|
||||
$.post("itemsuivi_tag_set", {
|
||||
itemsuivi_id: itemsuivi_id,
|
||||
taglist: tags.join(),
|
||||
});
|
||||
},
|
||||
autocomplete: {
|
||||
delay: 200, // ms before suggest
|
||||
position: { collision: "flip" }, // automatic menu position up/down
|
||||
source: "itemsuivi_tag_search",
|
||||
},
|
||||
});
|
||||
|
||||
// bind inplace editor
|
||||
nodes.find('div.itemsituation').jinplace();
|
||||
}
|
||||
// bind inplace editor
|
||||
nodes.find("div.itemsituation").jinplace();
|
||||
}
|
||||
|
||||
return nodes;
|
||||
};
|
||||
return nodes;
|
||||
}
|
||||
|
||||
function Date2DMY(date) {
|
||||
var year = date.getFullYear();
|
||||
var year = date.getFullYear();
|
||||
|
||||
var month = (1 + date.getMonth()).toString();
|
||||
month = month.length > 1 ? month : '0' + month;
|
||||
var month = (1 + date.getMonth()).toString();
|
||||
month = month.length > 1 ? month : "0" + month;
|
||||
|
||||
var day = date.getDate().toString();
|
||||
day = day.length > 1 ? day : '0' + day;
|
||||
var day = date.getDate().toString();
|
||||
day = day.length > 1 ? day : "0" + day;
|
||||
|
||||
return day + '/' + month + '/' + year;
|
||||
return day + "/" + month + "/" + year;
|
||||
}
|
||||
|
||||
function itemsuivi_suppress(itemsuivi_id) {
|
||||
$.post(SCO_URL + "/itemsuivi_suppress", { itemsuivi_id: itemsuivi_id });
|
||||
// Clear items and rebuild:
|
||||
$("ul.listdebouches li.itemsuivi").remove();
|
||||
display_itemsuivis(0);
|
||||
$.post(SCO_URL + "/itemsuivi_suppress", { itemsuivi_id: itemsuivi_id });
|
||||
// Clear items and rebuild:
|
||||
$("ul.listdebouches li.itemsuivi").remove();
|
||||
display_itemsuivis(0);
|
||||
}
|
||||
|
||||
@ -6,12 +6,11 @@
|
||||
// Ce code utilise d3.js
|
||||
|
||||
$().ready(function () {
|
||||
var etudid = $("#etudid")[0].value;
|
||||
var formsemestre_id = $("#formsemestre_id")[0].value;
|
||||
get_notes_and_draw(formsemestre_id, etudid);
|
||||
var etudid = $("#etudid")[0].value;
|
||||
var formsemestre_id = $("#formsemestre_id")[0].value;
|
||||
get_notes_and_draw(formsemestre_id, etudid);
|
||||
});
|
||||
|
||||
|
||||
var WIDTH = 460; // taille du canvas SVG
|
||||
var HEIGHT = WIDTH;
|
||||
var CX = WIDTH / 2; // coordonnees centre du cercle
|
||||
@ -24,258 +23,314 @@ var R_AXIS_TICS = [4, 6, 8, 10, 12, 14, 16, 18, 20];
|
||||
var NB_TICS = R_TICS.length;
|
||||
|
||||
function get_notes_and_draw(formsemestre_id, etudid) {
|
||||
console.log("get_notes(" + formsemestre_id + ", " + etudid + " )");
|
||||
/* Recupère le bulletin de note et extrait tableau de notes */
|
||||
/*
|
||||
console.log("get_notes(" + formsemestre_id + ", " + etudid + " )");
|
||||
/* Recupère le bulletin de note et extrait tableau de notes */
|
||||
/*
|
||||
var notes = [
|
||||
{ 'module' : 'E1',
|
||||
'note' : 13,
|
||||
'moy' : 16 },
|
||||
];
|
||||
*/
|
||||
var query = SCO_URL + "/Notes/formsemestre_bulletinetud?formsemestre_id=" + formsemestre_id + "&etudid=" + etudid + "&format=json&version=selectedevals&force_publishing=1"
|
||||
var query =
|
||||
SCO_URL +
|
||||
"/Notes/formsemestre_bulletinetud?formsemestre_id=" +
|
||||
formsemestre_id +
|
||||
"&etudid=" +
|
||||
etudid +
|
||||
"&fmt=json&version=selectedevals&force_publishing=1";
|
||||
|
||||
$.get(query, '', function (bul) {
|
||||
var notes = [];
|
||||
bul.ue.forEach(
|
||||
function (ue, i, ues) {
|
||||
ue['module'].forEach(function (m, i) {
|
||||
notes.push({
|
||||
'code': m['code'],
|
||||
'titre': m['titre'],
|
||||
'note': m['note']['value'],
|
||||
'moy': m['note']['moy']
|
||||
});
|
||||
});
|
||||
});
|
||||
draw_radar(notes);
|
||||
$.get(query, "", function (bul) {
|
||||
var notes = [];
|
||||
bul.ue.forEach(function (ue, i, ues) {
|
||||
ue["module"].forEach(function (m, i) {
|
||||
notes.push({
|
||||
code: m["code"],
|
||||
titre: m["titre"],
|
||||
note: m["note"]["value"],
|
||||
moy: m["note"]["moy"],
|
||||
});
|
||||
});
|
||||
});
|
||||
draw_radar(notes);
|
||||
});
|
||||
}
|
||||
|
||||
function draw_radar(notes) {
|
||||
/* Calcul coordonnées des éléments */
|
||||
var nmod = notes.length;
|
||||
var angle = 2 * Math.PI / nmod;
|
||||
/* Calcul coordonnées des éléments */
|
||||
var nmod = notes.length;
|
||||
var angle = (2 * Math.PI) / nmod;
|
||||
|
||||
for (var i = 0; i < notes.length; i++) {
|
||||
var d = notes[i];
|
||||
var cx = Math.sin(i * angle);
|
||||
var cy = - Math.cos(i * angle);
|
||||
d["x_v"] = CX + RR * d.note / 20 * cx;
|
||||
d["y_v"] = CY + RR * d.note / 20 * cy;
|
||||
d["x_moy"] = CX + RR * d.moy / 20 * cx;
|
||||
d["y_moy"] = CY + RR * d.moy / 20 * cy;
|
||||
d["x_20"] = CX + RR * cx;
|
||||
d["y_20"] = CY + RR * cy;
|
||||
d["x_label"] = CX + (RR + 25) * cx - 10
|
||||
d["y_label"] = CY + (RR + 25) * cy + 10;
|
||||
d["tics"] = [];
|
||||
// Coords des tics sur chaque axe
|
||||
for (var j = 0; j < NB_TICS; j++) {
|
||||
var r = R_TICS[j] / 20 * RR;
|
||||
d["tics"][j] = { "x": CX + r * cx, "y": CY + r * cy };
|
||||
}
|
||||
}
|
||||
|
||||
var notes_circ = notes.slice(0);
|
||||
notes_circ.push(notes[0])
|
||||
var notes_circ_valid = notes_circ.filter(function (e, i, a) { return e.note != 'NA' && e.note != '-'; });
|
||||
var notes_valid = notes.filter(function (e, i, a) { return e.note != 'NA' && e.note != '-'; })
|
||||
|
||||
/* Crée l'élément SVG */
|
||||
g = d3.select("#radar_bulletin").append("svg")
|
||||
.attr("class", "radar")
|
||||
.attr("width", WIDTH + 100)
|
||||
.attr("height", HEIGHT);
|
||||
|
||||
/* Centre */
|
||||
g.append("circle").attr("cy", CY)
|
||||
.attr("cx", CX)
|
||||
.attr("r", 2)
|
||||
.attr("class", "radar_center_mark");
|
||||
|
||||
/* Lignes "tics" */
|
||||
for (var i = 0; i < notes.length; i++) {
|
||||
var d = notes[i];
|
||||
var cx = Math.sin(i * angle);
|
||||
var cy = -Math.cos(i * angle);
|
||||
d["x_v"] = CX + ((RR * d.note) / 20) * cx;
|
||||
d["y_v"] = CY + ((RR * d.note) / 20) * cy;
|
||||
d["x_moy"] = CX + ((RR * d.moy) / 20) * cx;
|
||||
d["y_moy"] = CY + ((RR * d.moy) / 20) * cy;
|
||||
d["x_20"] = CX + RR * cx;
|
||||
d["y_20"] = CY + RR * cy;
|
||||
d["x_label"] = CX + (RR + 25) * cx - 10;
|
||||
d["y_label"] = CY + (RR + 25) * cy + 10;
|
||||
d["tics"] = [];
|
||||
// Coords des tics sur chaque axe
|
||||
for (var j = 0; j < NB_TICS; j++) {
|
||||
var ligne_tics = d3.svg.line()
|
||||
.x(function (d) { return d["tics"][j]["x"]; })
|
||||
.y(function (d) { return d["tics"][j]["y"]; });
|
||||
g.append("svg:path")
|
||||
.attr("class", "radar_disk_tic")
|
||||
.attr("id", "radar_disk_tic_" + R_TICS[j])
|
||||
.attr("d", ligne_tics(notes_circ));
|
||||
var r = (R_TICS[j] / 20) * RR;
|
||||
d["tics"][j] = { x: CX + r * cx, y: CY + r * cy };
|
||||
}
|
||||
}
|
||||
|
||||
/* Lignes radiales pour chaque module */
|
||||
g.selectAll("radar_rad")
|
||||
.data(notes)
|
||||
.enter().append("line")
|
||||
.attr("x1", CX)
|
||||
.attr("y1", CY)
|
||||
.attr("x2", function (d) { return d["x_20"]; })
|
||||
.attr("y2", function (d) { return d["y_20"]; })
|
||||
.attr("class", "radarrad");
|
||||
var notes_circ = notes.slice(0);
|
||||
notes_circ.push(notes[0]);
|
||||
var notes_circ_valid = notes_circ.filter(function (e, i, a) {
|
||||
return e.note != "NA" && e.note != "-";
|
||||
});
|
||||
var notes_valid = notes.filter(function (e, i, a) {
|
||||
return e.note != "NA" && e.note != "-";
|
||||
});
|
||||
|
||||
/* Crée l'élément SVG */
|
||||
g = d3
|
||||
.select("#radar_bulletin")
|
||||
.append("svg")
|
||||
.attr("class", "radar")
|
||||
.attr("width", WIDTH + 100)
|
||||
.attr("height", HEIGHT);
|
||||
|
||||
/* Lignes entre notes */
|
||||
var ligne = d3.svg.line()
|
||||
.x(function (d) { return d["x_v"]; })
|
||||
.y(function (d) { return d["y_v"]; });
|
||||
/* Centre */
|
||||
g.append("circle")
|
||||
.attr("cy", CY)
|
||||
.attr("cx", CX)
|
||||
.attr("r", 2)
|
||||
.attr("class", "radar_center_mark");
|
||||
|
||||
/* Lignes "tics" */
|
||||
for (var j = 0; j < NB_TICS; j++) {
|
||||
var ligne_tics = d3.svg
|
||||
.line()
|
||||
.x(function (d) {
|
||||
return d["tics"][j]["x"];
|
||||
})
|
||||
.y(function (d) {
|
||||
return d["tics"][j]["y"];
|
||||
});
|
||||
g.append("svg:path")
|
||||
.attr("class", "radarnoteslines")
|
||||
.attr("d", ligne(notes_circ_valid));
|
||||
.attr("class", "radar_disk_tic")
|
||||
.attr("id", "radar_disk_tic_" + R_TICS[j])
|
||||
.attr("d", ligne_tics(notes_circ));
|
||||
}
|
||||
|
||||
var ligne_moy = d3.svg.line()
|
||||
.x(function (d) { return d["x_moy"]; })
|
||||
.y(function (d) { return d["y_moy"]; })
|
||||
/* Lignes radiales pour chaque module */
|
||||
g.selectAll("radar_rad")
|
||||
.data(notes)
|
||||
.enter()
|
||||
.append("line")
|
||||
.attr("x1", CX)
|
||||
.attr("y1", CY)
|
||||
.attr("x2", function (d) {
|
||||
return d["x_20"];
|
||||
})
|
||||
.attr("y2", function (d) {
|
||||
return d["y_20"];
|
||||
})
|
||||
.attr("class", "radarrad");
|
||||
|
||||
g.append("svg:path")
|
||||
.attr("class", "radarmoylines")
|
||||
.attr("d", ligne_moy(notes_circ_valid));
|
||||
/* Lignes entre notes */
|
||||
var ligne = d3.svg
|
||||
.line()
|
||||
.x(function (d) {
|
||||
return d["x_v"];
|
||||
})
|
||||
.y(function (d) {
|
||||
return d["y_v"];
|
||||
});
|
||||
|
||||
/* Points (notes) */
|
||||
g.selectAll("circle1")
|
||||
.data(notes_valid)
|
||||
.enter().append("circle")
|
||||
.attr("cx", function (d) { return d["x_v"]; })
|
||||
.attr("cy", function (d) { return d["y_v"]; })
|
||||
.attr("r", function (x, i) { return 3; })
|
||||
.style("stroke-width", 1)
|
||||
.style("stroke", "black")
|
||||
.style("fill", "blue")
|
||||
.on("mouseover", function (d) {
|
||||
var rwidth = 310;
|
||||
var x = d["x_v"];
|
||||
if ((x - CX) < 0) {
|
||||
x = x + 5;
|
||||
if (x + rwidth + 12 > WIDTH) {
|
||||
x = WIDTH - rwidth - 12;
|
||||
}
|
||||
}
|
||||
else {
|
||||
if ((x - CX) > 0) {
|
||||
x = x - rwidth - 5;
|
||||
if (x < 12) {
|
||||
x = 12;
|
||||
}
|
||||
}
|
||||
else {
|
||||
x = CX - rwidth / 2;
|
||||
}
|
||||
}
|
||||
var yrect = d["y_v"];
|
||||
var ytext = d["y_v"];
|
||||
if ((yrect - CY) > 0) {
|
||||
yrect = yrect - 5 - 20;
|
||||
ytext = ytext - 5 - 20 + 16;
|
||||
}
|
||||
else {
|
||||
yrect = yrect + 5;
|
||||
ytext = ytext + 5 + 16;
|
||||
}
|
||||
var r = g.append("rect")
|
||||
.attr('class', 'radartip')
|
||||
.attr("x", x)
|
||||
.attr("y", yrect);
|
||||
g.append("svg:path")
|
||||
.attr("class", "radarnoteslines")
|
||||
.attr("d", ligne(notes_circ_valid));
|
||||
|
||||
var txt = g.append("text").text("Note: " + d.note + "/20, moyenne promo: " + d.moy + "/20")
|
||||
.attr('class', 'radartip')
|
||||
.attr("x", x + 5)
|
||||
.attr("y", ytext);
|
||||
r.attr("width", rwidth).attr("height", 20);
|
||||
})
|
||||
.on("mouseout", function (d) {
|
||||
d3.selectAll(".radartip").remove()
|
||||
});
|
||||
var ligne_moy = d3.svg
|
||||
.line()
|
||||
.x(function (d) {
|
||||
return d["x_moy"];
|
||||
})
|
||||
.y(function (d) {
|
||||
return d["y_moy"];
|
||||
});
|
||||
|
||||
/* Valeurs des notes */
|
||||
g.selectAll("notes_labels")
|
||||
.data(notes_valid)
|
||||
.enter().append("text")
|
||||
.text(function (d) { return d["note"]; })
|
||||
.attr("x", function (d) {
|
||||
return d["x_v"];
|
||||
})
|
||||
.attr("y", function (d) {
|
||||
if (d["y_v"] > CY)
|
||||
return d["y_v"] + 16;
|
||||
else
|
||||
return d["y_v"] - 8;
|
||||
})
|
||||
.attr("class", "note_label");
|
||||
g.append("svg:path")
|
||||
.attr("class", "radarmoylines")
|
||||
.attr("d", ligne_moy(notes_circ_valid));
|
||||
|
||||
/* Petits points sur les moyennes */
|
||||
g.selectAll("circle2")
|
||||
.data(notes_valid)
|
||||
.enter().append("circle")
|
||||
.attr("cx", function (d) { return d["x_moy"]; })
|
||||
.attr("cy", function (d) { return d["y_moy"]; })
|
||||
.attr("r", function (x, i) { return 2; })
|
||||
.style("stroke-width", 0)
|
||||
.style("stroke", "black")
|
||||
.style("fill", "rgb(20,90,50)");
|
||||
/* Points (notes) */
|
||||
g.selectAll("circle1")
|
||||
.data(notes_valid)
|
||||
.enter()
|
||||
.append("circle")
|
||||
.attr("cx", function (d) {
|
||||
return d["x_v"];
|
||||
})
|
||||
.attr("cy", function (d) {
|
||||
return d["y_v"];
|
||||
})
|
||||
.attr("r", function (x, i) {
|
||||
return 3;
|
||||
})
|
||||
.style("stroke-width", 1)
|
||||
.style("stroke", "black")
|
||||
.style("fill", "blue")
|
||||
.on("mouseover", function (d) {
|
||||
var rwidth = 310;
|
||||
var x = d["x_v"];
|
||||
if (x - CX < 0) {
|
||||
x = x + 5;
|
||||
if (x + rwidth + 12 > WIDTH) {
|
||||
x = WIDTH - rwidth - 12;
|
||||
}
|
||||
} else {
|
||||
if (x - CX > 0) {
|
||||
x = x - rwidth - 5;
|
||||
if (x < 12) {
|
||||
x = 12;
|
||||
}
|
||||
} else {
|
||||
x = CX - rwidth / 2;
|
||||
}
|
||||
}
|
||||
var yrect = d["y_v"];
|
||||
var ytext = d["y_v"];
|
||||
if (yrect - CY > 0) {
|
||||
yrect = yrect - 5 - 20;
|
||||
ytext = ytext - 5 - 20 + 16;
|
||||
} else {
|
||||
yrect = yrect + 5;
|
||||
ytext = ytext + 5 + 16;
|
||||
}
|
||||
var r = g
|
||||
.append("rect")
|
||||
.attr("class", "radartip")
|
||||
.attr("x", x)
|
||||
.attr("y", yrect);
|
||||
|
||||
/* Valeurs sur axe */
|
||||
g.selectAll("textaxis")
|
||||
.data(R_AXIS_TICS)
|
||||
.enter().append("text")
|
||||
.text(String)
|
||||
.attr("x", CX - 10)
|
||||
.attr("y", function (x, i) { return CY - x * RR / 20 + 6; })
|
||||
.attr("class", "textaxis");
|
||||
var txt = g
|
||||
.append("text")
|
||||
.text("Note: " + d.note + "/20, moyenne promo: " + d.moy + "/20")
|
||||
.attr("class", "radartip")
|
||||
.attr("x", x + 5)
|
||||
.attr("y", ytext);
|
||||
r.attr("width", rwidth).attr("height", 20);
|
||||
})
|
||||
.on("mouseout", function (d) {
|
||||
d3.selectAll(".radartip").remove();
|
||||
});
|
||||
|
||||
/* Noms des modules */
|
||||
g.selectAll("text_modules")
|
||||
.data(notes)
|
||||
.enter().append("text")
|
||||
.text(function (d) { return d['code']; })
|
||||
.attr("x", function (d) { return d['x_label']; })
|
||||
.attr("y", function (d) { return d['y_label']; })
|
||||
.attr("dx", 0)
|
||||
.attr("dy", 0)
|
||||
.on("mouseover", function (d) {
|
||||
var x = d["x_label"];
|
||||
var yrect = d["y_label"];
|
||||
var ytext = d["y_label"];
|
||||
var titre = d['titre'].replace("'", "'").substring(0, 64);
|
||||
var rwidth = titre.length * 9; // rough estimate of string width in pixels
|
||||
if ((x - CX) < 0) {
|
||||
x = x + 5;
|
||||
if (x + rwidth + 12 > WIDTH) {
|
||||
x = WIDTH - rwidth - 12;
|
||||
}
|
||||
}
|
||||
else {
|
||||
if ((x - CX) > 0) {
|
||||
x = x - rwidth - 5;
|
||||
if (x < 12) {
|
||||
x = 12;
|
||||
}
|
||||
}
|
||||
else {
|
||||
x = CX - rwidth / 2;
|
||||
}
|
||||
}
|
||||
if ((yrect - CY) > 0) {
|
||||
yrect = yrect - 5 - 20;
|
||||
ytext = ytext - 5 - 20 + 16;
|
||||
}
|
||||
else {
|
||||
yrect = yrect + 5;
|
||||
ytext = ytext + 5 + 16;
|
||||
}
|
||||
var r = g.append("rect")
|
||||
.attr('class', 'radartip')
|
||||
.attr("x", x)
|
||||
.attr("y", yrect)
|
||||
.attr("height", 20)
|
||||
.attr("width", rwidth);
|
||||
var txt = g.append("text").text(titre)
|
||||
.attr('class', 'radartip')
|
||||
.attr("x", x + 5)
|
||||
.attr("y", ytext);
|
||||
})
|
||||
.on("mouseout", function (d) {
|
||||
d3.selectAll(".radartip").remove()
|
||||
});
|
||||
/* Valeurs des notes */
|
||||
g.selectAll("notes_labels")
|
||||
.data(notes_valid)
|
||||
.enter()
|
||||
.append("text")
|
||||
.text(function (d) {
|
||||
return d["note"];
|
||||
})
|
||||
.attr("x", function (d) {
|
||||
return d["x_v"];
|
||||
})
|
||||
.attr("y", function (d) {
|
||||
if (d["y_v"] > CY) return d["y_v"] + 16;
|
||||
else return d["y_v"] - 8;
|
||||
})
|
||||
.attr("class", "note_label");
|
||||
|
||||
/* Petits points sur les moyennes */
|
||||
g.selectAll("circle2")
|
||||
.data(notes_valid)
|
||||
.enter()
|
||||
.append("circle")
|
||||
.attr("cx", function (d) {
|
||||
return d["x_moy"];
|
||||
})
|
||||
.attr("cy", function (d) {
|
||||
return d["y_moy"];
|
||||
})
|
||||
.attr("r", function (x, i) {
|
||||
return 2;
|
||||
})
|
||||
.style("stroke-width", 0)
|
||||
.style("stroke", "black")
|
||||
.style("fill", "rgb(20,90,50)");
|
||||
|
||||
/* Valeurs sur axe */
|
||||
g.selectAll("textaxis")
|
||||
.data(R_AXIS_TICS)
|
||||
.enter()
|
||||
.append("text")
|
||||
.text(String)
|
||||
.attr("x", CX - 10)
|
||||
.attr("y", function (x, i) {
|
||||
return CY - (x * RR) / 20 + 6;
|
||||
})
|
||||
.attr("class", "textaxis");
|
||||
|
||||
/* Noms des modules */
|
||||
g.selectAll("text_modules")
|
||||
.data(notes)
|
||||
.enter()
|
||||
.append("text")
|
||||
.text(function (d) {
|
||||
return d["code"];
|
||||
})
|
||||
.attr("x", function (d) {
|
||||
return d["x_label"];
|
||||
})
|
||||
.attr("y", function (d) {
|
||||
return d["y_label"];
|
||||
})
|
||||
.attr("dx", 0)
|
||||
.attr("dy", 0)
|
||||
.on("mouseover", function (d) {
|
||||
var x = d["x_label"];
|
||||
var yrect = d["y_label"];
|
||||
var ytext = d["y_label"];
|
||||
var titre = d["titre"].replace("'", "'").substring(0, 64);
|
||||
var rwidth = titre.length * 9; // rough estimate of string width in pixels
|
||||
if (x - CX < 0) {
|
||||
x = x + 5;
|
||||
if (x + rwidth + 12 > WIDTH) {
|
||||
x = WIDTH - rwidth - 12;
|
||||
}
|
||||
} else {
|
||||
if (x - CX > 0) {
|
||||
x = x - rwidth - 5;
|
||||
if (x < 12) {
|
||||
x = 12;
|
||||
}
|
||||
} else {
|
||||
x = CX - rwidth / 2;
|
||||
}
|
||||
}
|
||||
if (yrect - CY > 0) {
|
||||
yrect = yrect - 5 - 20;
|
||||
ytext = ytext - 5 - 20 + 16;
|
||||
} else {
|
||||
yrect = yrect + 5;
|
||||
ytext = ytext + 5 + 16;
|
||||
}
|
||||
var r = g
|
||||
.append("rect")
|
||||
.attr("class", "radartip")
|
||||
.attr("x", x)
|
||||
.attr("y", yrect)
|
||||
.attr("height", 20)
|
||||
.attr("width", rwidth);
|
||||
var txt = g
|
||||
.append("text")
|
||||
.text(titre)
|
||||
.attr("class", "radartip")
|
||||
.attr("x", x + 5)
|
||||
.attr("y", ytext);
|
||||
})
|
||||
.on("mouseout", function (d) {
|
||||
d3.selectAll(".radartip").remove();
|
||||
});
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user