Added lost code
This commit is contained in:
parent
9dcef3043b
commit
eb99b0a885
|
@ -426,6 +426,17 @@ function update_button_palette_callback() {
|
|||
$("#image_" + idItem).attr("src", "images/spinner.gif");
|
||||
setModuleGraph(idItem);
|
||||
break;
|
||||
case 'bars_graph':
|
||||
if($('input[name=width_percentile]').val() == ''){
|
||||
alert('Undefined width');
|
||||
return false;
|
||||
}
|
||||
|
||||
$("#text_" + idItem).html(values['label']);
|
||||
$("#image_" + idItem).attr("src", "images/spinner.gif");
|
||||
|
||||
setBarsGraph(idItem, values);
|
||||
break;
|
||||
case 'auto_sla_graph':
|
||||
if($('input[name=width]').val() == ''){
|
||||
alert('Undefined width');
|
||||
|
@ -440,14 +451,12 @@ function update_button_palette_callback() {
|
|||
|
||||
setEventsBar(idItem, values);
|
||||
break;
|
||||
case 'donut_graph':
|
||||
$("#image_" + idItem).attr("src", "images/spinner.gif");
|
||||
|
||||
setDonutsGraph(idItem, values);
|
||||
break;
|
||||
case 'simple_value':
|
||||
//checkpoint
|
||||
// if(($('#text-label_ifr').contents().find('#tinymce p').html() == '_VALUE_' ||
|
||||
// $('#text-label_ifr').contents().find('#tinymce').html() == '_VALUE_')
|
||||
// && $('#data_image_check').html() != 'On'){
|
||||
// alert('_VALUE_ exactly value is only enable for data image. Please change label text or select a data image module.');
|
||||
// return;
|
||||
// }
|
||||
$("#" + idItem).html(values['label']);
|
||||
if( (values['label'].replace( /<.*?>/g, '' ) != '_VALUE_')
|
||||
&& (values['label'].replace( /<.*?>/g, '' ) != '(_VALUE_)') ){
|
||||
|
@ -462,12 +471,7 @@ function update_button_palette_callback() {
|
|||
$("#" + idItem).html(
|
||||
'<table><tbody><tr><td></td></tr><tr><td><span style="" id="text_21" class="text">'+values["label"]+'</span></td></tr><tr><td></td></tr></tbody></table>'
|
||||
)
|
||||
|
||||
}
|
||||
|
||||
|
||||
//$("#simplevalue_" + idItem)
|
||||
//.html($('<img></img>').attr('src', "images/spinner.gif"));
|
||||
setModuleValue(idItem,values['process_simple_value'], values['period'],values['width']);
|
||||
break;
|
||||
case 'label':
|
||||
|
@ -622,6 +626,7 @@ function readFields() {
|
|||
}
|
||||
}
|
||||
values['height'] = $("input[name=height]").val();
|
||||
values['bars_graph_type'] = $("select[name=bars_graph_type]").val();
|
||||
values['parent'] = $("select[name=parent]").val();
|
||||
values['map_linked'] = $("select[name=map_linked]").val();
|
||||
values['width_percentile'] = $("input[name=width_percentile]").val();
|
||||
|
@ -709,6 +714,12 @@ function create_button_palette_callback() {
|
|||
validate = false;
|
||||
}
|
||||
break;
|
||||
case 'donut_graph':
|
||||
if ((values['agent'] == '')) {
|
||||
alert($("#message_alert_no_agent").html());
|
||||
validate = false;
|
||||
}
|
||||
break;
|
||||
case 'label':
|
||||
if ((values['label'] == '')) {
|
||||
alert($("#message_alert_no_label").html());
|
||||
|
@ -776,6 +787,16 @@ function create_button_palette_callback() {
|
|||
}
|
||||
}
|
||||
break;
|
||||
case 'bars_graph':
|
||||
if ((values['agent'] == '')) {
|
||||
alert($("#message_alert_no_agent").html());
|
||||
validate = false;
|
||||
}
|
||||
if ((values['module'] == 0)) {
|
||||
alert($("#message_alert_no_module").html());
|
||||
validate = false;
|
||||
}
|
||||
break;
|
||||
case 'simple_value':
|
||||
if ((values['agent'] == '')) {
|
||||
alert($("#message_alert_no_agent").html());
|
||||
|
@ -977,6 +998,7 @@ function toggle_item_palette() {
|
|||
|
||||
activeToolboxButton('static_graph', true);
|
||||
activeToolboxButton('module_graph', true);
|
||||
activeToolboxButton('bars_graph', true);
|
||||
activeToolboxButton('simple_value', true);
|
||||
activeToolboxButton('label', true);
|
||||
activeToolboxButton('icon', true);
|
||||
|
@ -985,6 +1007,7 @@ function toggle_item_palette() {
|
|||
activeToolboxButton('box_item', true);
|
||||
activeToolboxButton('line_item', true);
|
||||
activeToolboxButton('auto_sla_graph', true);
|
||||
activeToolboxButton('donut_graph', true);
|
||||
|
||||
if (typeof(enterprise_activeToolboxButton) == 'function') {
|
||||
enterprise_activeToolboxButton(true);
|
||||
|
@ -1004,7 +1027,9 @@ function toggle_item_palette() {
|
|||
|
||||
activeToolboxButton('static_graph', false);
|
||||
activeToolboxButton('module_graph', false);
|
||||
activeToolboxButton('bars_graph', false);
|
||||
activeToolboxButton('auto_sla_graph', false);
|
||||
activeToolboxButton('donut_graph', false);
|
||||
activeToolboxButton('simple_value', false);
|
||||
activeToolboxButton('label', false);
|
||||
activeToolboxButton('icon', false);
|
||||
|
@ -1277,6 +1302,8 @@ function loadFieldsFromDB(item) {
|
|||
$("input[name=width_module_graph]").val(val);
|
||||
if (key == 'height_module_graph')
|
||||
$("input[name=height_module_graph]").val(val);
|
||||
if (key == 'bars_graph_type')
|
||||
$("select[name=bars_graph_type]").val(val);
|
||||
if (key == 'type_percentile')
|
||||
$("select[name=type_percentile]").val(val);
|
||||
if (key == 'percentile_label')
|
||||
|
@ -1540,6 +1567,9 @@ function hiddenFields(item) {
|
|||
$("#module_graph_size_row").css('display', 'none');
|
||||
$("#module_graph_size_row." + item).css('display', '');
|
||||
|
||||
$("#bars_graph_type").css('display', 'none');
|
||||
$("#bars_graph_type." + item).css('display', '');
|
||||
|
||||
$("#background_color").css('display', 'none');
|
||||
$("#background_color." + item).css('display', '');
|
||||
|
||||
|
@ -1756,6 +1786,60 @@ function set_image(type, idElement, image) {
|
|||
});
|
||||
}
|
||||
|
||||
function setBarsGraph(id_data, values) {
|
||||
var url_hack_metaconsole = '';
|
||||
if (is_metaconsole()) {
|
||||
url_hack_metaconsole = '../../';
|
||||
}
|
||||
|
||||
width_percentile = values['width_percentile'];
|
||||
|
||||
parameter = Array();
|
||||
|
||||
parameter.push ({name: "page", value: "include/ajax/visual_console_builder.ajax"});
|
||||
parameter.push ({name: "action", value: "get_module_type_string"});
|
||||
parameter.push ({name: "id_agent", value: values['id_agent']});
|
||||
parameter.push ({name: "module", value: values['module']});
|
||||
parameter.push ({name: "id_element", value: id_data});
|
||||
parameter.push ({name: "id_visual_console", value: id_visual_console});
|
||||
jQuery.ajax({
|
||||
url: get_url_ajax(),
|
||||
data: parameter,
|
||||
type: "POST",
|
||||
dataType: 'json',
|
||||
success: function (data) {
|
||||
if (data['no_data'] == true) {
|
||||
if (values['width_percentile'] == "0") {
|
||||
$("#" + id_data + " img").attr('src', url_hack_metaconsole + 'images/console/signes/barras-no.png');
|
||||
}
|
||||
else {
|
||||
$("#" + id_data + " img").attr('src', url_hack_metaconsole + 'images/console/signes/barras-no.png');
|
||||
$("#" + id_data + " img").css('width', width_percentile + 'px');
|
||||
$("#" + id_data + " img").css('height', width_percentile + 'px');
|
||||
}
|
||||
}
|
||||
else {
|
||||
$("#" + id_data + " img").attr('src', url_hack_metaconsole + 'images/console/signes/barras.png');
|
||||
|
||||
if (values['width_percentile'] == "0") {
|
||||
// Image size
|
||||
}
|
||||
else{
|
||||
$("#" + id_data + " img").css('width', width_percentile+'px');
|
||||
$("#" + id_data + " img").css('height', width_percentile+'px');
|
||||
}
|
||||
}
|
||||
|
||||
if($('#'+id_data+' table').css('float') == 'right' || $('#'+id_data+ ' table').css('float') == 'left'){
|
||||
$('#'+id_data+ ' img').css('margin-top', parseInt($('#'+id_data).css('height'))/2 - parseInt($('#'+id_data+ ' img').css('height'))/2);
|
||||
}
|
||||
else{
|
||||
$('#'+id_data+ ' img').css('margin-left', parseInt($('#'+id_data).css('width'))/2 - parseInt($('#'+id_data+ ' img').css('width'))/2);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function setModuleGraph(id_data) {
|
||||
var parameter = Array();
|
||||
|
||||
|
@ -2141,6 +2225,53 @@ function setEventsBar(id_data, values) {
|
|||
});
|
||||
}
|
||||
|
||||
function setDonutsGraph (id_data, values) {
|
||||
var url_hack_metaconsole = '';
|
||||
if (is_metaconsole()) {
|
||||
url_hack_metaconsole = '../../';
|
||||
}
|
||||
|
||||
width_percentile = values['width_percentile'];
|
||||
|
||||
parameter = Array();
|
||||
|
||||
parameter.push ({name: "page", value: "include/ajax/visual_console_builder.ajax"});
|
||||
parameter.push ({name: "action", value: "get_module_type_string"});
|
||||
parameter.push ({name: "id_agent", value: values['id_agent']});
|
||||
parameter.push ({name: "id_agent_module", value: values['module']});
|
||||
parameter.push ({name: "id_element", value: id_data});
|
||||
parameter.push ({name: "id_visual_console", value: id_visual_console});
|
||||
jQuery.ajax({
|
||||
url: get_url_ajax(),
|
||||
data: parameter,
|
||||
type: "POST",
|
||||
dataType: 'json',
|
||||
success: function (data) {
|
||||
if (data['no_data'] == true) {
|
||||
if (values['width'] == "0") {
|
||||
$("#" + id_data + " img").attr('src', url_hack_metaconsole + 'images/console/signes/wrong_donut_graph.png');
|
||||
}
|
||||
else {
|
||||
$("#" + id_data + " img").attr('src', url_hack_metaconsole + 'images/console/signes/wrong_donut_graph.png');
|
||||
$("#" + id_data + " img").css('width', width_percentile + 'px');
|
||||
$("#" + id_data + " img").css('height', width_percentile + 'px');
|
||||
}
|
||||
}
|
||||
else {
|
||||
$("#" + id_data + " img").attr('src', url_hack_metaconsole + 'images/console/signes/donut-graph.png');
|
||||
|
||||
if($('#text-width').val() == 0 || $('#text-height').val() == 0){
|
||||
// Image size
|
||||
}
|
||||
else{
|
||||
$("#" + id_data + " img").css('width', $('#text-width_percentile').val()+'px');
|
||||
$("#" + id_data + " img").css('height', $('#text-width_percentile').val()+'px');
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function setPercentileBubble(id_data, values) {
|
||||
metaconsole = $("input[name='metaconsole']").val();
|
||||
|
||||
|
@ -2499,6 +2630,16 @@ function createItem(type, values, id_data) {
|
|||
|
||||
setEventsBar(id_data, values);
|
||||
break;
|
||||
case 'donut_graph':
|
||||
var sizeStyle = '';
|
||||
var imageSize = '';
|
||||
item = $('<div id="' + id_data + '" class="item donut_graph" style="text-align: left; position: absolute; display: inline-block; ' + sizeStyle + ' top: ' + values['top'] + 'px; left: ' + values['left'] + 'px;">' +
|
||||
'<img class="image" id="image_' + id_data + '" src="images/spinner.gif" />' +
|
||||
'</div>'
|
||||
);
|
||||
|
||||
setDonutsGraph(id_data, values);
|
||||
break;
|
||||
case 'percentile_bar':
|
||||
case 'percentile_item':
|
||||
var sizeStyle = '';
|
||||
|
@ -2678,6 +2819,42 @@ function createItem(type, values, id_data) {
|
|||
|
||||
setModuleGraph(id_data);
|
||||
break;
|
||||
case 'bars_graph':
|
||||
sizeStyle = '';
|
||||
imageSize = '';
|
||||
|
||||
if(values['label_position'] == 'up'){
|
||||
item = $('<div id="' + id_data + '" class="item module_graph" style="text-align: left; position: absolute; ' + sizeStyle + ' top: ' + values['top'] + 'px; left: ' + values['left'] + 'px;">' +
|
||||
'<table><tr><td></td></tr><tr><td><span id="text_' + id_data + '" class="text">' + values['label'] + '</span></td></tr><tr><td></td></tr></table>' +
|
||||
'<img class="image" id="image_' + id_data + '" src="images/spinner.gif" />' +
|
||||
'</div>'
|
||||
);
|
||||
}
|
||||
else if(values['label_position'] == 'down'){
|
||||
item = $('<div id="' + id_data + '" class="item module_graph" style="text-align: left; position: absolute; ' + sizeStyle + ' top: ' + values['top'] + 'px; left: ' + values['left'] + 'px;">' +
|
||||
'<img class="image" id="image_' + id_data + '" src="images/spinner.gif" />' +
|
||||
'<table><tr><td></td></tr><tr><td><span id="text_' + id_data + '" class="text">' + values['label'] + '</span></td></tr><tr><td></td></tr></table>' +
|
||||
'</div>'
|
||||
);
|
||||
}
|
||||
else if(values['label_position'] == 'left'){
|
||||
item = $('<div id="' + id_data + '" class="item module_graph" style="text-align: left; position: absolute; ' + sizeStyle + ' top: ' + values['top'] + 'px; left: ' + values['left'] + 'px;">' +
|
||||
'<img style="float:right" class="image" id="image_' + id_data + '" src="images/spinner.gif" />' +
|
||||
'<table style="float:left;height:'+values['height_module_graph']+'px;"><tr><td></td></tr><tr><td><span id="text_' + id_data + '" class="text">' + values['label'] + '</span></td></tr><tr><td></td></tr></table>' +
|
||||
'</div>'
|
||||
);
|
||||
}
|
||||
else if(values['label_position'] == 'right'){
|
||||
item = $('<div id="' + id_data + '" class="item module_graph" style="text-align: left; position: absolute; ' + sizeStyle + ' top: ' + values['top'] + 'px; left: ' + values['left'] + 'px;">' +
|
||||
'<img style="float:left" class="image" id="image_' + id_data + '" src="images/spinner.gif" />' +
|
||||
'<table style="float:right;height:'+values['height_module_graph']+'px;"><tr><td></td></tr><tr><td><span id="text_' + id_data + '" class="text">' + values['label'] + '</span></td></tr><tr><td></td></tr></table>' +
|
||||
'</div>'
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
setBarsGraph(id_data, values);
|
||||
break;
|
||||
case 'simple_value':
|
||||
sizeStyle = '';
|
||||
imageSize = '';
|
||||
|
@ -2897,7 +3074,9 @@ function updateDB_visual(type, idElement , values, event, top, left) {
|
|||
case 'label':
|
||||
case 'icon':
|
||||
case 'module_graph':
|
||||
case 'bars_graph':
|
||||
case 'auto_sla_graph':
|
||||
case 'donut_graph':
|
||||
if (type == 'simple_value') {
|
||||
setModuleValue(idElement,
|
||||
values.process_simple_value,
|
||||
|
@ -3309,6 +3488,15 @@ function eventsItems(drag) {
|
|||
activeToolboxButton('delete_item', true);
|
||||
activeToolboxButton('show_grid', false);
|
||||
}
|
||||
if ($(divParent).hasClass('donut_graph')) {
|
||||
creationItem = null;
|
||||
selectedItem = 'donut_graph';
|
||||
idItem = $(divParent).attr('id');
|
||||
activeToolboxButton('copy_item', true);
|
||||
activeToolboxButton('edit_item', true);
|
||||
activeToolboxButton('delete_item', true);
|
||||
activeToolboxButton('show_grid', false);
|
||||
}
|
||||
if ($(divParent).hasClass('group_item')) {
|
||||
creationItem = null;
|
||||
selectedItem = 'group_item';
|
||||
|
@ -3336,6 +3524,15 @@ function eventsItems(drag) {
|
|||
activeToolboxButton('delete_item', true);
|
||||
activeToolboxButton('show_grid', false);
|
||||
}
|
||||
if ($(divParent).hasClass('bars_graph')) {
|
||||
creationItem = null;
|
||||
selectedItem = 'bars_graph';
|
||||
idItem = $(divParent).attr('id');
|
||||
activeToolboxButton('copy_item', true);
|
||||
activeToolboxButton('edit_item', true);
|
||||
activeToolboxButton('delete_item', true);
|
||||
activeToolboxButton('show_grid', false);
|
||||
}
|
||||
if ($(divParent).hasClass('simple_value')) {
|
||||
creationItem = null;
|
||||
selectedItem = 'simple_value';
|
||||
|
@ -3509,6 +3706,9 @@ function eventsItems(drag) {
|
|||
if ($(event.target).hasClass('auto_sla_graph')) {
|
||||
selectedItem = 'auto_sla_graph';
|
||||
}
|
||||
if ($(event.target).hasClass('donut_graph')) {
|
||||
selectedItem = 'donut_graph';
|
||||
}
|
||||
if ($(event.target).hasClass('group_item')) {
|
||||
selectedItem = 'group_item';
|
||||
}
|
||||
|
@ -3518,6 +3718,9 @@ function eventsItems(drag) {
|
|||
if ($(event.target).hasClass('module_graph')) {
|
||||
selectedItem = 'module_graph';
|
||||
}
|
||||
if ($(event.target).hasClass('bars_graph')) {
|
||||
selectedItem = 'bars_graph';
|
||||
}
|
||||
if ($(event.target).hasClass('simple_value')) {
|
||||
selectedItem = 'simple_value';
|
||||
}
|
||||
|
@ -3821,10 +4024,18 @@ function click_button_toolbox(id) {
|
|||
toolbuttonActive = creationItem = 'module_graph';
|
||||
toggle_item_palette();
|
||||
break;
|
||||
case 'bars_graph':
|
||||
toolbuttonActive = creationItem = 'bars_graph';
|
||||
toggle_item_palette();
|
||||
break;
|
||||
case 'auto_sla_graph':
|
||||
toolbuttonActive = creationItem = 'auto_sla_graph';
|
||||
toggle_item_palette();
|
||||
break;
|
||||
case 'donut_graph':
|
||||
toolbuttonActive = creationItem = 'donut_graph';
|
||||
toggle_item_palette();
|
||||
break;
|
||||
case 'simple_value':
|
||||
toolbuttonActive = creationItem = 'simple_value';
|
||||
toggle_item_palette();
|
||||
|
@ -3876,12 +4087,14 @@ function click_button_toolbox(id) {
|
|||
activeToolboxButton('static_graph', false);
|
||||
activeToolboxButton('percentile_item', false);
|
||||
activeToolboxButton('module_graph', false);
|
||||
activeToolboxButton('bars_graph', false);
|
||||
activeToolboxButton('simple_value', false);
|
||||
activeToolboxButton('label', false);
|
||||
activeToolboxButton('icon', false);
|
||||
activeToolboxButton('service', false);
|
||||
activeToolboxButton('group_item', false);
|
||||
activeToolboxButton('auto_sla_graph', false);
|
||||
activeToolboxButton('donut_graph', false);
|
||||
activeToolboxButton('copy_item', false);
|
||||
activeToolboxButton('edit_item', false);
|
||||
activeToolboxButton('delete_item', false);
|
||||
|
@ -3907,11 +4120,13 @@ function click_button_toolbox(id) {
|
|||
activeToolboxButton('static_graph', true);
|
||||
activeToolboxButton('percentile_item', true);
|
||||
activeToolboxButton('module_graph', true);
|
||||
activeToolboxButton('bars_graph', true);
|
||||
activeToolboxButton('simple_value', true);
|
||||
activeToolboxButton('label', true);
|
||||
activeToolboxButton('icon', true);
|
||||
activeToolboxButton('group_item', true);
|
||||
activeToolboxButton('auto_sla_graph', true);
|
||||
activeToolboxButton('donut_graph', true);
|
||||
}
|
||||
break;
|
||||
case 'save_visualmap':
|
||||
|
|
|
@ -384,4 +384,28 @@ function progress_circular_bar_interior ($id, $percentile, $width, $height, $col
|
|||
return $output;
|
||||
}
|
||||
|
||||
function d3_donut_graph ($id, $width, $height, $module_data) {
|
||||
global $config;
|
||||
|
||||
$module_data = json_encode($module_data);
|
||||
|
||||
$recipient_name = "donut_graph_" . $id;
|
||||
$recipient_name_to_js = "#donut_graph_" . $id;
|
||||
|
||||
$output = "<div id=" . $recipient_name . " style='overflow: hidden;'></div>";
|
||||
$output .= include_javascript_d3(true);
|
||||
$output .= "<style type=\"text/css\">
|
||||
path {
|
||||
stroke: #fff;
|
||||
fill-rule: evenodd;
|
||||
}
|
||||
</style>";
|
||||
|
||||
$output .= "<script language=\"javascript\" type=\"text/javascript\">
|
||||
print_donut_graph('" . $recipient_name_to_js . "', " . $width . ", " . $height . ", " . $module_data . ");
|
||||
</script>";
|
||||
|
||||
return $output;
|
||||
}
|
||||
|
||||
?>
|
||||
|
|
|
@ -1962,4 +1962,120 @@ function print_interior_circular_progress_bar (recipient, percentile, width, hei
|
|||
setTimeout(loops, 30);
|
||||
}
|
||||
})();
|
||||
}
|
||||
|
||||
function print_donut_graph (recipient, width, height, module_data) {
|
||||
var svg = d3.select(recipient)
|
||||
.append("svg")
|
||||
.attr("width", width)
|
||||
.attr("height", height)
|
||||
.append("g");
|
||||
|
||||
svg.append("g")
|
||||
.attr("class", "slices");
|
||||
|
||||
var radius = 120;
|
||||
var increment_y = 60;
|
||||
var increment_y_padding = 25;
|
||||
var text_size = 15;
|
||||
var decrement_x_padding = 150;
|
||||
if (width >= 500) {
|
||||
radius = 160;
|
||||
increment_y = 60;
|
||||
text_size = 25;
|
||||
increment_y_padding = 25;
|
||||
decrement_x_padding = 75;
|
||||
}
|
||||
else if (width >= 400) {
|
||||
radius = 120;
|
||||
increment_y = 60;
|
||||
text_size = 22;
|
||||
increment_y_padding = 25;
|
||||
decrement_x_padding = 75;
|
||||
}
|
||||
else if (width >= 300) {
|
||||
radius = 80;
|
||||
increment_y = 40;
|
||||
text_size = 14;
|
||||
increment_y_padding = 20;
|
||||
decrement_x_padding = 60;
|
||||
}
|
||||
else if (width >= 200) {
|
||||
radius = 50;
|
||||
increment_y = 40;
|
||||
text_size = 14;
|
||||
increment_y_padding = 15;
|
||||
decrement_x_padding = 45;
|
||||
}
|
||||
else if (width >= 100) {
|
||||
radius = 20;
|
||||
increment_y = 20;
|
||||
text_size = 10;
|
||||
increment_y_padding = 8;
|
||||
decrement_x_padding = 25;
|
||||
}
|
||||
else {
|
||||
radius = 10;
|
||||
increment_y = 10;
|
||||
text_size = 4;
|
||||
increment_y_padding = 3;
|
||||
decrement_x_padding = 5;
|
||||
}
|
||||
|
||||
var arc = d3.svg.arc()
|
||||
.outerRadius(radius * 0.8)
|
||||
.innerRadius(radius * 0.4);
|
||||
|
||||
var key = function(d){ return d.data.label; };
|
||||
|
||||
var pie = d3.layout.pie()
|
||||
.sort(null)
|
||||
.value(function(d) {
|
||||
return parseFloat(d.percent);
|
||||
});
|
||||
|
||||
jQuery.each(module_data, function (key, m_d) {
|
||||
svg.append("g")
|
||||
.append("text")
|
||||
.attr("transform", "translate(" + (((width / 2) - (radius + decrement_x_padding))) + "," + (((height / 2) - radius) - increment_y) + ")")
|
||||
.text(m_d.tag_name)
|
||||
.style("font-family", "Verdana")
|
||||
.style("font-size", text_size + "px");
|
||||
|
||||
increment_y -= increment_y_padding;
|
||||
});
|
||||
|
||||
function donutData (){
|
||||
return module_data.map(function(m_data){
|
||||
return { label: m_data.tag_name, percent: m_data.percent, color : m_data.color}
|
||||
});
|
||||
}
|
||||
|
||||
print_phases(donutData());
|
||||
|
||||
function print_phases(data) {
|
||||
var slice = svg.select(".slices").selectAll("path.slice")
|
||||
.data(pie(data), key);
|
||||
|
||||
slice.enter()
|
||||
.insert("path")
|
||||
.style("fill", function(d) {
|
||||
return d.data.color;
|
||||
})
|
||||
.attr("class", "slice")
|
||||
.attr("transform", "translate(" + width / 2 + "," + (height - radius) + ")");
|
||||
|
||||
slice.transition()
|
||||
.duration(0)
|
||||
.attrTween("d", function(d) {
|
||||
this._current = this._current || d;
|
||||
var interpolate = d3.interpolate(this._current, d);
|
||||
this._current = interpolate(0);
|
||||
return function(t) {
|
||||
return arc(interpolate(t));
|
||||
};
|
||||
});
|
||||
|
||||
slice.exit().remove();
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue