Related
Defined an own table layouts using pdfmake.js. On print I want per page to contain 7 rows(fixed).I have tried adjusting the height and width of the table cell to contain 7 rows but however if the data in table cell increases the page accumulates with less/more no.of rows.
//layout of the table:
var tablelist={
style: 'tableExample',
table: {
dontBreakRows: true,
widths: [ 20,55,55,55,55,55,55,55,55,55,55,55,55],
headerRows: 1,
body: body
},
layout: {
hLineWidth: function (i, node) {
return (i === 0 || i === node.table.body.length) ? 1 : 1;
},
vLineWidth: function (i, node) {
return (i === 0 || i === node.table.widths.length) ? 1: 1;
},
hLineColor: function (i, node) {
return (i === 0 || i === node.table.body.length) ? 'gray' : 'gray';
},
vLineColor: function (i, node) {
return (i === 0 || i === node.table.widths.length) ? 'gray' : 'gray';
},
},
}
return tablelist;
}
//pushing the table header and other data to the table body
$scope.makePrintTable = function(){
var headers = {
col_1:{ text: 'Day', style: 'tableHeader',rowSpan: 1, alignment: 'center',margin: [0, 8, 0, 0] },
col_2:{ text: 'Date', style: 'tableHeader',rowSpan: 1, alignment: 'center',margin: [0, 8, 0, 0] },
col_3:{ text: '0600-0800', style: 'tableHeader',rowSpan: 1, alignment: 'center',margin: [0, 8, 0, 0] },
.
.
.//Similarly till col_13
col_13:{ text: '1700-1800', style: 'tableHeader',rowSpan: 1, alignment: 'center' ,margin: [0, 8, 0, 0]},
}
body = [];
var row = new Array();
for (var key in headers) {
row.push( headers[key] );
}
body.push(row);
for ( var j=0 ; j< $scope.table.length; j++){
var tableEach={ };
tableEach= $scope.table[j];
/*This for Genarating Object variables*/
for (var i = 1; i < 3; i++) {
window["obj"+i] = new Object();
}
var row = new Array();
var slNoValue = tableEach.slNo;
/*This is for slNo */
obj1["text"] = slNoValue;
obj1["style"]= "cellswidth";
row.push(obj1);
/*This is for Date */
var dateValue = new Date(tableEach.date);
obj2["text"]= dateValue.getDate() + '-' + basicFormats.getMonthName(dateValue.getMonth() )+ '-' + dateValue.getFullYear()+','+ basicFormats.getDayName(dateValue.getDay());
obj2["style"]= "cellswidth";
row.push(obj2);
/*This is for remaining columns (i ranges from 6 to 17 (time in 24hrs clock format) ) */
for(var i=6 ; i<=17 ; i++){
var obj={};
var hourValue = "hour_"+i+"_"+(i+1)+"_value";
var hourValueColor = "hour_"+i+"_"+(i+1)+"_"+"color_value";
hourValue = ( tableEach["hour_"+i] == undefined ? '':(tableEach["hour_"+i]));
hourValueColor =(tableEach["hour_"+i+"_colour"] == undefined ? '#ffffff':(tableEach["hour_"+i+"_colour"]));
obj["text"] = hourValue;
obj["fillColor"] = hourValueColor;
obj["style"] = "cellswidth";
row.push(obj);
console.log(obj);
}
// if( j!= 0 && j % 7 == 0){
// pageBreak : 'before'
// }
}
body.push(row);
}
};
//CSS for tablecells
cellswidth : {
fontSize: 10,
// color:'gray',
bold: true,
alignment: 'center',
margin: [0, 12.55, 0, 12.75],
},
You can use pageBreak function for it:
pageBreakBefore: function(currentNode, followingNodesOnPage, nodesOnNextPage, previousNodesOnPage) {
//Here you can change the criteria according to your requirements
if (currentNode.index % 7 === 0)) {
return true;
}
return false;
},
I need help with a really annoying error I've been getting with my GMOD gamemode. I am trying to make a custom menu, but I get this error:
[ERROR] gamemodes/tdm/gamemode/custom_menu.lua:20: attempt to call global 'addButtons' (a nil value)
1. gameMenu - gamemodes/tdm/gamemode/custom_menu.lua:20
2. unknown - gamemodes/tdm/gamemode/custom_menu.lua:32
3. include - [C]:-1
4. unknown - gamemodes/tdm/gamemode/cl_init.lua:3
Here is my code:
custom_menu.lua
local Menu
function gameMenu()
if(Menu == nil) then
Menu = vgui.Create("DFrame")
Menu:SetSize(750, 500)
Menu:SetPos(ScrW() / 2 - 325, ScrH() / 2 - 250)
Menu:SetTitle("Gamemode Menu")
Menu:SetDraggable(true)
Menu:ShowCloseButton(false)
Menu:SetDeleteOnClose(false)
Menu.Paint = function()
surface.SetDrawColor(60, 60, 60, 255)
surface.DrawRect(0, 0, Menu:GetWide(), Menu:GetTall())
surface.SetDrawColor(40, 40, 40, 255)
surface.DrawRect(0, 24, Menu:GetWide(), 1)
end
addButtons(Menu)
gui.EnableScreenClicker(true)
else
if(Menu:IsVisible()) then
Menu:SetVisible(false)
gui.EnableScreenClicker(false)
else
Menu:SetVisible(true)
gui.EnableScreenClicker(true)
end
end
end
concommand.Add("open_game_menu", gameMenu())
function addButtons(Menu)
local playerButton = vgui.Create("DButton")
playerButton:SetParent(Menu)
playerButton:SetText("")
playerButton:SetSize(100, 50)
playerButton:SetPos(0, 25)
playerButton.Paint = function()
--Color of entire button
surface.SetDrawColor(50, 50, 50, 255)
surface.DrawRect(0, 0, playerButton:GetWide(), playerButton:GetTall())
--Draw Bottom and Right borders
surface.SetDrawColor(40, 40, 40, 255)
surface.DrawRect(0, 49, playerButton:GetWide(), 1)
surface.DrawRect(99, 0, 1, playerButton:GetTall())
--Draw Text
draw.DrawText("Player", "DermaDefaultBold", playerButton:GetWide() / 2, 17, Color(255, 255, 255, 255), 1)
end
playerButton.DoClick = function(playerButton)
local playerPanel = Menu:Add("PlayerPanel")
end
local shopButton = vgui.Create("DButton")
shopButton:SetParent(Menu)
shopButton:SetText("")
shopButton:SetSize(100, 50)
shopButton:SetPos(0, 75)
shopButton.Paint = function()
--Color of entire button
surface.SetDrawColor(50, 50, 50, 255)
surface.DrawRect(0, 0, shopButton:GetWide(), shopButton:GetTall())
--Draw Bottom and Right borders
surface.SetDrawColor(40, 40, 40, 255)
surface.DrawRect(0, 49, shopButton:GetWide(), 1)
surface.DrawRect(99, 0, 1, shopButton:GetTall())
--Draw Text
draw.DrawText("Shop", "DermaDefaultBold", shopButton:GetWide() / 2, 17, Color(255, 255, 255, 255), 1)
end
shopButton.DoClick = function(shopButton)
local shopPanel = Menu:Add("ShopPanel")
end
end
--Player Panel
PANEL = {} -- Create an empty panel
function PANEL:Init() --Initialize the panel
self:SetSize(650, 475)
self:SetPos(100, 25)
end
function PANEL:Paint(w, h)
draw.RoundedBox(0, 0, 0, w, h, Color(0, 0, 0, 255))
end
vgui.Register("PlayerPanel", PANEL, "Panel")
--End Player Panel
--Shop Panel
PANEL = {} -- Create an empty panel
function PANEL:Init() --Initialize the panel
self:SetSize(650, 475)
self:SetPos(100, 25)
end
function PANEL:Paint(w, h)
draw.RoundedBox(0, 0, 0, w, h, Color(255, 255, 255, 255))
end
vgui.Register("ShopPanel", PANEL, "Panel")
--End Shop Panel
init.lua:
AddCSLuaFile( "shared.lua" )
AddCSLuaFile( "cl_init.lua" )
AddCSLuaFile( "testhud.lua" )
local open = false
include ( 'shared.lua' )
local open = false
function GM:PlayerInitialSpawn(ply)
if(ply:GetPData("playerLvl") == nil) then
ply:SetNWInt("playerLvl", 1)
else
ply:SetNWInt("playerLvl", ply:GetPData("playerLvl"))
end
if(ply:GetPData("playerExp") == nil) then
ply:SetNWInt("playerExp", 0)
else
ply:SetNWInt("playerExp", ply:GetPData("playerExp"))
end
if(ply:GetPData("playerMoney") == nil) then
ply:SetNWInt("playerMoney", 0)
else
ply:SetNWInt("playerMoney", ply:GetPData("playerMoney"))
end
end
function GM:OnNPCKilled(npc, attacker, inflictor)
attacker:SetNWInt("playerMoney", attacker:GetNWInt("playerMoney") + 100)
attacker:SetNWInt("playerExp", attacker:GetNWInt("playerExp") + 100)
checkForLevel(attacker)
end
function GM:PlayerDeath(victim, inflictor, attacker)
attacker:SetNWInt("playerMoney", attacker:GetNWInt("playerMoney") + 100)
attacker:SetNWInt("playerExp", attacker:GetNWInt("playerExp") + 100)
checkForLevel(attacker)
end
function GM:PlayerLoadout(ply)
ply:Give("m9k_l85")
ply:Give("m9k_colt1911")
ply:Give("m9k_knife")
ply:Give("m9k_m61_frag")
ply:GiveAmmo(500, "ar2", true)
ply:GiveAmmo(100, "pistol", true)
return true
end
function checkForLevel(ply)
local expToLevel = (ply:GetNWInt("playerLvl") * 100) * 2
local curExp = ply:GetNWInt("playerExp")
local curLvl = ply:GetNWInt("playerLvl")
if(curExp >= expToLevel) then
curExp = curExp - expToLevel
ply:SetNWInt("playerExp", curExp)
ply:SetNWInt("playerLvl", curLvl + 1)
end
end
function GM:PlayerDisconnected(ply)
ply:SetPData("playerExp", ply:GetNWInt("playerExp"))
ply:SetPData("playerLvl", ply:GetNWInt("playerLvl"))
ply:SetPData("playerMoney", ply:GetNWInt("playerMoney"))
end
function GM:ShutDown()
for k, v in pairs(player.GetAll()) do
v:SetPData("playerExp", v:GetNWInt("playerExp"))
v:SetPData("playerLvl", v:GetNWInt("playerLvl"))
v:SetPData("playerMoney", v:GetNWInt("playerMoney"))
end
end
function GM:ShowSpare2(ply)
ply:ConCommand("open_game_menu")
end
Thanks!
-Graham
You call
concommand.Add("open_game_menu", gameMenu())
which calls addButtons(Menu) which is nil at this point as the function definition follows after concommand.Add("open_game_menu", gameMenu()).
It's all there. You just have to read the error message.
Change the order in your script to fix the error.
I have a weekly chart to display data of 3 years in weeks,
And the chart have 2 XAxis, one show the week number , the other one show the year,
Screen Capture of the chart
Both Axis have the same data Length, but different tick Length,
the Year XAxis label only show on the tick where week number equal to 1
(I have set offset to the Year Axis, so it not exactly shown below the week number 1)
Now I want to display Year Axis Tick when week number equal to 1 only.
So I add "tickPositions" with array [0,53,105] (position of week number of those 3 year) to Year Axis,
but the chart become:
Screen Capture after adding "tickPositions"
Since I only add 3 tick according to the array, why there are so many ticks on the chart?
And how can I fix it? Thank you very much! :)
Thanks Sebastian, after I include the plug-in to the page, it show below error:
Have you seen it before? Thanks!
Another question, I also have a same chart that show daily data, how can I group date time chart? Thanks!
Screen Capture of the error__http://postimg.org/image/iqgfspxqt/
My Year xAxis code:
{
labels: {
align: 'left',
x: 25,
formatter: function () {
var ex = this.axis.getExtremes();
if ((ex.max - ex.min) > 30) {
if (xCategoriesWeekNum[this.value] == 1)
return xCategoriesYear[this.value];
}
else if (((ex.max - ex.min) > 10)) {
if ((xCategoriesWeekNum[this.value] == 1) || ((xCategoriesWeekNum[this.value] % 10) == 0))
return xCategoriesYear[this.value];
}
else {
if ((xCategoriesWeekNum[this.value] == 1) || ((xCategoriesWeekNum[this.value] % 5) == 0))
return xCategoriesYear[this.value];
}
}
},
//offset: 0,
lineWidth: 0,
tickLength: 12,
tickPosition: 'inside',
tickInterval: 1,
tickPositions: [0, 53, 105],
tickPlacement: 'on',
//tickPositioner: function () {
// var ex = this.chart.xAxis[0].getExtremes();
// alert(getTickPosition(ex.min, ex.max));
// return getTickPosition(ex.min, ex.max);
//},
title: {
text: 'Week Number',
},
startOnTick: false,
endOnTick: false,
minPadding: 0,
maxPadding: 0,
}],
My Week xAxis code:
[{
labels: {
formatter: function () {
var ex = this.axis.getExtremes();
if ((ex.max - ex.min) > 30) {
if ((xCategoriesWeekNum[this.value] == 1) || (xCategoriesWeekNum[this.value] == 7) || (xCategoriesWeekNum[this.value] == 13) || (xCategoriesWeekNum[this.value] == 19) || (xCategoriesWeekNum[this.value] == 25) || (xCategoriesWeekNum[this.value] == 31) || (xCategoriesWeekNum[this.value] == 37) || (xCategoriesWeekNum[this.value] == 43) || (xCategoriesWeekNum[this.value] == 49)) {
return xCategoriesWeekNum[this.value];
//if (xCategoriesWeekNum[this.value] == 1)
// return xCategoriesWeekNum[this.value] + '<br>' + xCategoriesYear[this.value];
//else
}
}
else {
return xCategoriesWeekNum[this.value];
}
}
},
tickPixelInterval: $('#' + container).width() / dataLength,
tickInterval: 1,
showLastLabel: true,
startOnTick: false,
endOnTick: false,
minPadding: 0,
maxPadding: 0,
}
the labels are one on another(overlapping)
is there an option to arrange them correctly ? (my real data is dynamic, and number of series is also dynamic)
example:
http://jsfiddle.net/6kBQY/
$(function () {
$('#container').highcharts({
chart: {
},
xAxis: {
categories: ['aa', 'bb', 'cc', 'dd', 'ee', 'ff']
},
plotOptions: {
series: {
dataLabels: {
enabled: true,
borderRadius: 5,
backgroundColor: 'rgba(252, 255, 197, 0.7)',
borderWidth: 1,
borderColor: '#AAA',
y: -6
}
}
},
series: [{
data: [10, 20, 30, 25, 15, 5]
},{
data: [11, 22, 33, 20, 10, 0]
}]
});
});
You can use small workaround like here
function StaggerDataLabels(series) {
sc = series.length;
if (sc < 2) return;
for (s = 1; s < sc; s++) {
var s1 = series[s - 1].points,
s2 = series[s].points,
l = s1.length,
diff, h;
for (i = 0; i < l; i++) {
if (s1[i].dataLabel && s2[i].dataLabel) {
diff = s1[i].dataLabel.y - s2[i].dataLabel.y;
h = s1[i].dataLabel.height + 2;
if (isLabelOnLabel(s1[i].dataLabel, s2[i].dataLabel)) {
if (diff < 0) s1[i].dataLabel.translate(s1[i].dataLabel.translateX, s1[i].dataLabel.translateY - (h + diff));
else s2[i].dataLabel.translate(s2[i].dataLabel.translateX, s2[i].dataLabel.translateY - (h - diff));
}
}
}
}
}
//compares two datalabels and returns true if they overlap
function isLabelOnLabel(a, b) {
var al = a.x - (a.width / 2);
var ar = a.x + (a.width / 2);
var bl = b.x - (b.width / 2);
var br = b.x + (b.width / 2);
var at = a.y;
var ab = a.y + a.height;
var bt = b.y;
var bb = b.y + b.height;
if (bl > ar || br < al) {
return false;
} //overlap not possible
if (bt > ab || bb < at) {
return false;
} //overlap not possible
if (bl > al && bl < ar) {
return true;
}
if (br > al && br < ar) {
return true;
}
if (bt > at && bt < ab) {
return true;
}
if (bb > at && bb < ab) {
return true;
}
return false;
}
http://jsfiddle.net/menXU/7/
Sorry if the title or my explanation are bad, probleme is not easy in french so in english ...
So, i try to make a chart like : Focus+Context via Brushing but, instead of having one path to show data, i've 500 circle.
For moment, Zoom and Pan dont work.
To my understanding of problem, i need to convert my 500 circle to one single path but i dont know how to do this, if it's the good solution or event if it's possible ..
Thanks for your help, here a fiddle (my first one): http://jsfiddle.net/Kazual/R96Kc/
And the code: (i give all the code, but this is only the pan effect that i need to fix, all data are random and dont mean anything, and use the 3 button on bottom right to update circle position)
function graphiqueCircle(x, y, w, h, trgDiv){
graphiqueCircle.C_INDICE_VIE = "Indice Vie";
graphiqueCircle.C_INDICE_SANTE = "Indice Sante";
graphiqueCircle.C_INDICE_INSTRUCTION = "Indice Instruction";
var indiceVie = false,
indiceSante = false,
indiceInstruction = false;
var margin = {top: y, right: 0, bottom: 0, left: x},
width = w,
height = h,
height2 = 20;
//
var x = d3.scale.linear()
.range([0, width]);
var y = d3.scale.linear()
.range([height, 0]);
var x2 = d3.scale.linear()
.range([0, width]);
var y2 = d3.scale.linear()
.range([height2, 0]);
//
var color = d3.scale.category10();
//
var xAxis = d3.svg.axis()
.scale(x)
.orient("bottom");
var yAxis = d3.svg.axis()
.scale(y)
.orient("left");
var xAxis2 = d3.svg.axis()
.scale(x2)
.orient("bottom");
//
var brush = d3.svg.brush()
.x(x2)
.on("brush", brushed);
//
var area = d3.svg.area()
.interpolate("monotone")
.x(function(d) { return x(d.codeCom); })
.y0(height)
.y1(function(d) { return [0,1]; });
var area2 = d3.svg.area()
.interpolate("monotone")
.x(function(d) { return x2(d.codeCom); })
.y0(height2)
.y1(function(d) { return [0,1]; });
//
var svg = d3.select(trgDiv).append("svg").attr("class", "gMap")
.attr("width", width + 50 )
.attr("height", height + 50 + height2 +50);
//
svg.append("defs").append("clipPath")
.attr("id", "clip")
.append("rect")
.attr("width", width)
.attr("height", height);
//
var allCircles,
allCirclesContext,
theckBox,
axeX,
axeY,
_data;
//
var focus = svg.append("g")
.attr("transform", "translate(" + (margin.left + 10) + "," + margin.top + ")")
var context = svg.append("g")
.attr("transform", "translate(" + (margin.left + 10) + "," + (margin.top+height+height2+30) + ")")
//
_data = [
{codeCom:33001, communes:"obj1", indiceVie:0.4, indiceSante:0.5, indiceInstruction:0.3, IDH:0.6, LIBSCOT:"lib1"},
{codeCom:33002, communes:"obj2", indiceVie:0.4, indiceSante:0.5, indiceInstruction:0.3, IDH:0.6, LIBSCOT:"lib2"},
{codeCom:33003, communes:"obj3", indiceVie:0.4, indiceSante:0.5, indiceInstruction:0.3, IDH:0.6, LIBSCOT:"lib3"},
{codeCom:33004, communes:"obj4", indiceVie:0.4, indiceSante:0.5, indiceInstruction:0.3, IDH:0.6, LIBSCOT:"lib4"},
{codeCom:33005, communes:"obj5", indiceVie:0.4, indiceSante:0.5, indiceInstruction:0.3, IDH:0.6, LIBSCOT:"lib5"},
{codeCom:33006, communes:"obj6", indiceVie:0.4, indiceSante:0.5, indiceInstruction:0.3, IDH:0.6, LIBSCOT:"lib6"},
{codeCom:33007, communes:"obj7", indiceVie:0.4, indiceSante:0.5, indiceInstruction:0.3, IDH:0.6, LIBSCOT:"lib7"},
{codeCom:33008, communes:"obj8", indiceVie:0.4, indiceSante:0.5, indiceInstruction:0.3, IDH:0.6, LIBSCOT:"lib8"},
{codeCom:33009, communes:"obj9", indiceVie:0.4, indiceSante:0.5, indiceInstruction:0.3, IDH:0.6, LIBSCOT:"lib9"}
]
_data.forEach(function(d) {
d.IDH4 = (d.IDH4 != "NULL") ? +d.IDH4 : 0;
d.indiceVie = (d.indiceVie != "NULL") ? +d.indiceVie : 0;
d.indiceSante = (d.indiceSante != "NULL") ? +d.indiceSante : 0;
d.indiceInstruction = (d.indiceInstruction != "NULL") ? +d.indiceInstruction : 0;
d.codeCom = (d.codeCom != "NULL") ? +d.codeCom : 0;
});
//
x.domain(d3.extent(_data.map(function(d) { return d.codeCom; })));
y.domain([0,1]);
x2.domain(x.domain());
y2.domain(y.domain());
//
allCircles = focus.append("g");
allCircles.attr("id", "allCicles")
.datum(_data)
.attr("clip-path", "url(#clip)")
.attr("d", area)
.selectAll(".dot")
.data(_data)
.enter().append("circle")
.attr("class", "dot")
.attr("id", function(d){ return d.communes; })
.attr("r", 3.5)
.attr("cx", function(d) { return x(d.codeCom); })
.attr("cy", function(d) { return 0; })
.style("fill", function(d) { return color(d.LIBSCOT); });
focus.append("g")
.attr("class", "x axis")
.attr("transform", "translate(0," + height + ")")
.call(xAxis)
.append("text")
.attr("class", "label")
.attr("x", width)
.attr("y", -6)
.style("text-anchor", "end")
.text("Communes");
focus.append("g")
.attr("class", "y axis")
.call(yAxis)
.append("text")
.attr("class", "label")
.attr("transform", "rotate(-90)")
.attr("y", 6)
.attr("x", -6)
.attr("dy", ".71em")
.style("text-anchor", "end")
.text("Indice");
allCirclesContext = context.append("g");
allCirclesContext.attr("id", "allCirclesContext")
.datum(_data)
.attr("d", area2)
.selectAll(".dot")
.data(_data)
.enter().append("circle")
.attr("class", "dot")
.attr("id", function(d){ return d.communes; })
.attr("r", 2)
.attr("cx", function(d) { return x2(d.codeCom); })
.attr("cy", function(d) { return 0; })
.style("fill", function(d) { return color(d.LIBSCOT); });
context.append("g")
.attr("class", "x axis")
.attr("transform", "translate(0," + height2 + ")")
.call(xAxis2);
//
context.append("g")
.attr("transform", function(d, i) { return "translate(0,-20)"; })
.style("fill", "blue")
.attr("class", "x brush")
.call(brush)
.selectAll("rect")
.attr("y", -6)
.attr("height", height2 + 7)
.style("fill-opacity", .2)
.style("visibility", "visible");
//
// LEGEND & CHEKBOX
var legend = focus.selectAll(".legend")
.data(color.domain())
.enter().append("g")
.attr("class", "legend")
.attr("transform", function(d, i) { return "translate(0," + i * 20 + ")"; });
legend.append("rect")
.attr("x", width - 18)
.attr("width", 18)
.attr("height", 18)
.style("fill", color);
legend.append("text")
.attr("x", width - 24)
.attr("y", 9)
.attr("dy", ".35em")
.style("text-anchor", "end")
.text(function(d) { return d; });
//
createTchekBox();
function createTchekBox(){
theckBox = focus.selectAll(".theckBox")
.data(["Indice Vie", "Indice Sante", "Indice Instruction"])
.enter().append("g")
.attr("class", "theckBox")
.attr("transform", function(d, i) { return "translate(0," + ((i * 20)+300) + ")"; });
theckBox.append("rect")
.attr("isClicked", "false")
.attr("id", function(d) { return d; })
.attr("x", width - 18)
.attr("width", 18)
.attr("height", 18)
.style("fill", "black")
.on("mouseover", function(){
d3.select(this).style("fill", "grey");
})
.on("mouseout", function(){
if(d3.select(this).attr("isClicked") == "false")
d3.select(this).style("fill", "black");
else
d3.select(this).style("fill", "red");
})
.on("click", function(){
if(d3.select(this).attr("isClicked") == "false"){
d3.select(this).style("fill", "red");
d3.select(this).attr("isClicked", "true");
}else{
d3.select(this).style("fill", "black");
d3.select(this).attr("isClicked", "false");
}
if(d3.select(this).attr("id") == "Indice Vie")
indiceVie = !indiceVie;
else if(d3.select(this).attr("id") == "Indice Sante")
indiceSante = !indiceSante;
else if(d3.select(this).attr("id") == "Indice Instruction")
indiceInstruction = !indiceInstruction;
//
onUpdate();
});
theckBox.append("text")
.attr("x", width - 24)
.attr("y", 9)
.attr("dy", ".35em")
.style("text-anchor", "end")
.text(function(d) { return d; });
}
function brushed() {
x.domain(brush.empty() ? x2.domain() : brush.extent());
focus.select("#allCicles").attr("d", area);
focus.select(".x.axis").call(xAxis);
}
function onUpdate(){
var data1,
data2,
data3;
//
if(indiceVie)
data1 = graphiqueCircle.C_INDICE_VIE;
else
data1 = null;
if(indiceSante)
data2 = graphiqueCircle.C_INDICE_SANTE;
else
data2 = null;
if(indiceInstruction)
data3 = graphiqueCircle.C_INDICE_INSTRUCTION;
else
data3 = null;
//
allCircles.selectAll(".dot").each(function(d, i){
d3.select(this).transition().duration(400).delay(i*1)
.attr("cy", function(d, i) {
var returnValue = 0;
var diviseur = 0;
if(data1 == graphiqueCircle.C_INDICE_VIE){
returnValue += y(d.indiceVie);
diviseur++;
}
if(data2 == graphiqueCircle.C_INDICE_SANTE){
returnValue += y(d.indiceSante);
diviseur++;
}
if(data3 == graphiqueCircle.C_INDICE_INSTRUCTION){
returnValue += y(d.indiceInstruction);
diviseur++;
}
if(diviseur == 0)
return 0;
return returnValue/diviseur;
});
});
allCirclesContext.selectAll(".dot").each(function(d, i){
d3.select(this).transition().duration(400).delay(i*1)
.attr("cy", function(d, i) {
var returnValue = 0;
var diviseur = 0;
if(data1 == graphiqueCircle.C_INDICE_VIE){
returnValue += y2(d.indiceVie);
diviseur++;
}
if(data2 == graphiqueCircle.C_INDICE_SANTE){
returnValue += y2(d.indiceSante);
diviseur++;
}
if(data3 == graphiqueCircle.C_INDICE_INSTRUCTION){
returnValue += y2(d.indiceInstruction);
diviseur++;
}
if(diviseur == 0)
return 0;
return returnValue/diviseur-20;
});
});
}
}
var _myGraphique = new graphiqueCircle(20, 20, 800, 400, ".div_iMap");