This commit is contained in:
JORGE LUIS CAUDILLO ESPARZA
2020-09-18 16:03:19 -07:00
parent a8c7c25b6f
commit e1c02482fc

View File

@@ -1397,40 +1397,40 @@
$('.LblTituloGraficaGral').text(Titulo); $('.LblTituloGraficaGral').text(Titulo);
cargaGraficaBarras2(); cargaGraficaBarras2();
} }
function cargaGraficaBarras2() { function cargaGraficaBarras2() {
//Hypgrafica //Hypgrafica
$("#DivModalGraficaGral").modal(); $("#DivModalGraficaGral").modal();
let infogral = $('#grafInfo'); let infogral = $('#grafInfo');
infogral.find('>*').remove(); infogral.find('>*').remove();
let items = [] let items = []
let data; let data;
let icolor = 0; let icolor = 0;
let tipografica = $('.rdblistgrafica input:checked').val(); let tipografica = $('.rdblistgrafica input:checked').val();
$('.ajax__tab_panel:visible .chkgraf input:checked').each(function () { $('.ajax__tab_panel:visible .chkgraf input:checked').each(function () {
data = $(this).closest('tr').find('.Hypgrafica').data('values') data = $(this).closest('tr').find('.Hypgrafica').data('values')
let name = $(this).closest('td').text().trim() let name = $(this).closest('td').text().trim()
items.push({ id: icolor, data: data, name: name, Color: Colores[icolor], tipografica }) items.push({ id: icolor, data: data, name: name, Color: Colores[icolor], tipografica })
gettitlegraf(infogral, icolor, Colores[icolor], name, tipografica); gettitlegraf(infogral, icolor, Colores[icolor], name, tipografica);
icolor = icolor + 1; icolor = icolor + 1;
if (icolor >= Colores.length) { icolor = 0; } if (icolor >= Colores.length) { icolor = 0; }
}); });
objetos = items; objetos = items;
$(".chkonchange input").each(function () { $(".chkonchange input").each(function () {
let _this = $(this) let _this = $(this)
_this.change(function () { _this.change(function () {
let _this = $(this) let _this = $(this)
let id = Number(_this.data('id')) let id = Number(_this.data('id'))
objetos[id].tipografica = _this.is(':checked') ? 1 : 2; objetos[id].tipografica = _this.is(':checked') ? 1 : 2;
ShowGraf2(); ShowGraf2();
}) })
}); });
$(function () { $(function () {
$('.chkonchange').tooltip() $('.chkonchange').tooltip()
}); });
ShowGraf2(); ShowGraf2();
} }
function gettitlegraf(infogral, id, Color, name, tipografica) { function gettitlegraf(infogral, id, Color, name, tipografica) {
let strtipografica = '<span class="chksino chkonchange" data-html="true" data-original-title="<div style=\'white-space:nowrap;\'>\'B\' Barras / \'L\' Lineas </div>" ><input id="chk' + id + '" ' + (tipografica == 1 ? 'checked="checked"' : '"') + ' data-id="' + id + '" type="checkbox" name="nchk' + id + '"><label for="chk' + id + '"> </label></span>'; let strtipografica = '<span class="chksino chkonchange" data-html="true" data-original-title="<div style=\'white-space:nowrap;\'>\'B\' Barras / \'L\' Lineas </div>" ><input id="chk' + id + '" ' + (tipografica == 1 ? 'checked="checked"' : '"') + ' data-id="' + id + '" type="checkbox" name="nchk' + id + '"><label for="chk' + id + '"> </label></span>';
@@ -1444,28 +1444,28 @@
/*contenedor.append(divcolspan);*/ contenedor.append(divcolor); contenedor.append(divtexto); contenedor.append(divtipografica); /*contenedor.append(divcolspan);*/ contenedor.append(divcolor); contenedor.append(divtexto); contenedor.append(divtipografica);
} }
function ShowGraf2() { function ShowGraf2() {
let items = objetos; let items = objetos;
let series = []; let series = [];
if (items) { if (items) {
data = items[0].data; data = items[0].data;
series.push(( series.push((
(items[0].tipografica == 1) ? (items[0].tipografica == 1) ?
{ {
"balloonText": "[[title]]: <b>[[value]]</b> [[Moneda]]", "balloonText": "[[title]]: <b>[[value]]</b> [[Moneda]]",
"colorField": "Color", "colorField": "Color",
"fillAlphas": 1, "fillAlphas": 1,
"lineAlpha": 0.1, "lineAlpha": 0.1,
"type": "column", "type": "column",
"title": items[0].name, "title": items[0].name,
"valueField": 'Valor' "valueField": 'Valor'
} : } :
{ {
"balloonText": "[[title]]: <b>[[value]]</b> [[Moneda]]", "balloonText": "[[title]]: <b>[[value]]</b> [[Moneda]]",
"colorField": "Color", "colorField": "Color",
"bullet": "round", "bullet": "round",
"dashLength": 3, "dashLength": 3,
"colorField": "color", "colorField": "color",
"type": "line", "type": "line",
"title": items[0].name, "title": items[0].name,
"valueField": "Valor" "valueField": "Valor"
} }
@@ -1475,7 +1475,7 @@
data[i]['Color'] = items[0].Color data[i]['Color'] = items[0].Color
} }
for (var indexcol = 1; indexcol < items.length; indexcol++) { for (var indexcol = 1; indexcol < items.length; indexcol++) {
let cdatos = items[indexcol].data; let cdatos = items[indexcol].data;
let valueField = 'Valor' + indexcol; let valueField = 'Valor' + indexcol;
let colorField = 'Color' + indexcol; let colorField = 'Color' + indexcol;
@@ -1483,109 +1483,109 @@
for (var i = 0; i < cdatos.length; i++) { for (var i = 0; i < cdatos.length; i++) {
data[i][valueField] = cdatos[i].Valor data[i][valueField] = cdatos[i].Valor
data[i][colorField] = items[indexcol].Color data[i][colorField] = items[indexcol].Color
} }
series.push(( series.push((
(items[indexcol].tipografica == 1) ? (items[indexcol].tipografica == 1) ?
{ {
"balloonText": "[[title]]: <b>[[value]]</b> [[Moneda]]", "balloonText": "[[title]]: <b>[[value]]</b> [[Moneda]]",
"colorField": colorField, "colorField": colorField,
"fillAlphas": 1, "fillAlphas": 1,
"lineAlpha": 0.1, "lineAlpha": 0.1,
"type": "column", "type": "column",
"title": items[indexcol].name, "title": items[indexcol].name,
"valueField": valueField "valueField": valueField
} : } :
{ {
"balloonText": "[[title]]: <b>[[value]]</b> [[Moneda]]", "balloonText": "[[title]]: <b>[[value]]</b> [[Moneda]]",
"colorField": colorField, "colorField": colorField,
"bullet": "round", "bullet": "round",
"dashLength": 3, "dashLength": 3,
"colorField": "color", "colorField": "color",
"type": "line", "type": "line",
"title": items[indexcol].name, "title": items[indexcol].name,
"valueField": valueField "valueField": valueField
} }
)); ));
} }
var chart = AmCharts.makeChart("chartdivgral", { var chart = AmCharts.makeChart("chartdivgral", {
"type": "serial", "type": "serial",
"theme": "light", "theme": "light",
"dataProvider": data, "dataProvider": data,
"startDuration": 2, "legend": { "startDuration": 2, "legend": {
"generateFromData": true // "data": data.map(function(num) { return {title:num.Texto ,color:num.Color}; }) "generateFromData": true // "data": data.map(function(num) { return {title:num.Texto ,color:num.Color}; })
}, },
"valueAxes": [{ "valueAxes": [{
"position": "left", "position": "left",
"title": "Ventas" "title": "Ventas"
}], }],
"graphs": series, "graphs": series,
"depth3D": 20, "depth3D": 20,
"angle": 30, "angle": 30,
"chartCursor": { "chartCursor": {
"categoryBalloonEnabled": false, "categoryBalloonEnabled": false,
"cursorAlpha": 0, "cursorAlpha": 0,
"zoomable": false "zoomable": false
}, },
"categoryField": "Texto", "categoryField": "Texto",
"categoryAxis": { "categoryAxis": {
"gridPosition": "start", "gridPosition": "start",
"labelRotation": 90 "labelRotation": 90
}, },
"export": { "export": {
"enabled": true "enabled": true
} }
}); });
} }
} }
function initamgrafica() { function initamgrafica() {
AmCharts.addInitHandler(function (chart) { AmCharts.addInitHandler(function (chart) {
function handleCustomMarkerToggle(legendEvent) { function handleCustomMarkerToggle(legendEvent) {
var dataProvider = legendEvent.chart.dataProvider; var dataProvider = legendEvent.chart.dataProvider;
var itemIndex; var itemIndex;
legendEvent.chart.toggleLegend = true; legendEvent.chart.toggleLegend = true;
if (undefined !== legendEvent.dataItem.hidden && legendEvent.dataItem.hidden) { if (undefined !== legendEvent.dataItem.hidden && legendEvent.dataItem.hidden) {
legendEvent.dataItem.hidden = false; legendEvent.dataItem.hidden = false;
dataProvider.push(legendEvent.dataItem.storedObj); dataProvider.push(legendEvent.dataItem.storedObj);
legendEvent.dataItem.storedObj = undefined; legendEvent.dataItem.storedObj = undefined;
dataProvider.sort(function (lhs, rhs) { dataProvider.sort(function (lhs, rhs) {
return lhs.dataIdx - rhs.dataIdx; return lhs.dataIdx - rhs.dataIdx;
}); });
} else { } else {
legendEvent.dataItem.hidden = true; legendEvent.dataItem.hidden = true;
for (var i = 0; i < dataProvider.length; ++i) { for (var i = 0; i < dataProvider.length; ++i) {
if (dataProvider[i].dataIdx === legendEvent.dataItem.dataIdx) { if (dataProvider[i].dataIdx === legendEvent.dataItem.dataIdx) {
itemIndex = i; itemIndex = i;
break; break;
} }
} }
legendEvent.dataItem.storedObj = dataProvider[itemIndex]; legendEvent.dataItem.storedObj = dataProvider[itemIndex];
dataProvider.splice(itemIndex, 1); dataProvider.splice(itemIndex, 1);
} }
legendEvent.chart.validateData(); legendEvent.chart.validateData();
} }
if (!chart.legend || !chart.legend.enabled || !chart.legend.generateFromData) { if (!chart.legend || !chart.legend.enabled || !chart.legend.generateFromData) {
return; return;
} }
var categoryField = chart.categoryField; var categoryField = chart.categoryField;
var colorField = chart.graphs[0].lineColorField || chart.graphs[0].fillColorsField || chart.graphs[0].colorField; var colorField = chart.graphs[0].lineColorField || chart.graphs[0].fillColorsField || chart.graphs[0].colorField;
var legendData = chart.dataProvider.map(function (data, idx) { var legendData = chart.dataProvider.map(function (data, idx) {
var markerData = { var markerData = {
"title": data[categoryField], "title": data[categoryField],
"color": data[colorField], "color": data[colorField],
"dataIdx": idx "dataIdx": idx
}; };
if (!markerData.color) { if (!markerData.color) {
markerData.color = chart.graphs[0].lineColor; markerData.color = chart.graphs[0].lineColor;
} }
data.dataIdx = idx; data.dataIdx = idx;
return markerData; return markerData;
}); });
chart.legend.data = legendData; chart.legend.data = legendData;
chart.legend.switchable = true; chart.legend.switchable = true;
chart.legend.addListener("clickMarker", handleCustomMarkerToggle); chart.legend.addListener("clickMarker", handleCustomMarkerToggle);
}, ["serial"]); }, ["serial"]);
} }