two jqxchart in one view

[crballonParticipant]

hi, i have two jqxchart in one view, but only show a chart in the view, helpme plis

my code is the following:

//GRAFICOS TORREROS

var fasbal= @ViewBag.balesiaTotal31 + @ViewBag.balesiaTotal21;
var fasta= @ViewBag.taTotal31 + @ViewBag.taTotal21;
var fastcont = @ViewBag.continentalTotal31 + @ViewBag.continentalTotal21;
var fastorre = @ViewBag.torresecTotal31 + @ViewBag.torresecTotal21;

var sampleDataX = [
{ Contr: ‘Balesia’, SINCAN:@ViewBag.balesiaTotal51, CONCAN:@ViewBag.balesiaTotal51, NEGOCON:@ViewBag.balesiaTotal41, ING:@ViewBag.balesiaTotal42, FIRMCO:@ViewBag.balesiaTotal43, DISE:@ViewBag.balesiaTotal44, INGMUN:@ViewBag.balesiaTotal45, LICEN:@ViewBag.balesiaTotal46, FAS: fasbal},
{ Contr: ‘Torres andinas’, SINCAN:@ViewBag.taTotal51, CONCAN:@ViewBag.taTotal52, NEGOCON:@ViewBag.taTotal41, ING:@ViewBag.taTotal42, FIRMCO:@ViewBag.taTotal43, DISE:@ViewBag.taTotal44, INGMUN:@ViewBag.taTotal45, LICEN:@ViewBag.taTotal46, FAS: fasta},
{ Contr: ‘Continental’, SINCAN:@ViewBag.continentalTotal51, CONCAN:@ViewBag.continentalTotal52, NEGOCON:@ViewBag.continentalTotal41, ING:@ViewBag.continentalTotal42, FIRMCO:@ViewBag.continentalTotal43, DISE:@ViewBag.continentalTotal44, INGMUN:@ViewBag.continentalTotal45, LICEN:@ViewBag.continentalTotal46, FAS: fastcont},
{ Contr: ‘Torresec’, SINCAN:@ViewBag.torresecTotal51, CONCAN:@ViewBag.torresecTotal52, NEGOCON:@ViewBag.torresecTotal41, ING:@ViewBag.torresecTotal42, FIRMCO:@ViewBag.torresecTotal43, DISE:@ViewBag.torresecTotal44, INGMUN:@ViewBag.torresecTotal45, LICEN:@ViewBag.torresecTotal46, FAS: fastorre},

];

var settingsX = {
title: “Torreros”,
description: “Resumen de avance”,
padding: { left: 5, top: 5, right: 5, bottom: 5 },
titlePadding: { left: 90, top: 0, right: 0, bottom: 10 },
source: sampleDataX,
categoryAxis:
{
dataField: ‘Contr’,
showGridLines: false
},
colorScheme: ‘scheme02’,
seriesGroups:
[
{
type: ‘column’,
columnsGapPercent: 30,
seriesGapPercent: 0,
valueAxis:
{
minValue: 0,
maxValue: 70,
unitInterval: 10,
description: ‘Numero de candidatos’
},
series: [
{ dataField: ‘SINCAN’, displayText: ‘5.1 SIN CANDIDATO’ },
{ dataField: ‘CONCAN’, displayText: ‘5.2 CON CANDIDATO’ },
{ dataField: ‘NEGOCON’, displayText: ‘4.1 EN NEGOCIACION CON PROPIETARIO’ },
{ dataField: ‘ING’, displayText: ‘4.2 ING EXP TDP (EA)’ },
{ dataField: ‘FIRMCO’, displayText: ‘4.3 FIRMA CON PROPIETARIO’ },
{ dataField: ‘DISE’, displayText: ‘4.4 EN DISEÑO’ },
{ dataField: ‘INGMUN’, displayText: ‘4.5 ING EXP MUNICIPIO’ },
{ dataField: ‘LICEN’, displayText: ‘4.6 EN LICENCIA’ },
{ dataField: ‘FAS’, displayText: ‘FAS’ }

]
}
]
};

$(‘#chartContainerX’).jqxChart(settingsX);

//—————————————————–

//GRAFICOS CONTRATISTAS

var fashf = @ViewBag.hfTotal31 + @ViewBag.hfTotal21;
var fasdsite = @ViewBag.dsiteTotal31 + @ViewBag.dsiteTotal21;
var fasdisy = @ViewBag.disyconTotal31 + @ViewBag.disyconTotal21;
var faseric = @ViewBag.ericssonTotal31 + @ViewBag.ericssonTotal21;

var sampleData = [
{ Day: ‘HF Telecom’, SINCAN:@ViewBag.hfTotal51, CONCAN:@ViewBag.hfTotal52, NEGOCON:@ViewBag.hfTotal41, ING:@ViewBag.hfTotal42, FIRMCO:@ViewBag.hfTotal43, DISE:@ViewBag.hfTotal44, INGMUN:@ViewBag.hfTotal45, LICEN:@ViewBag.hfTotal46, FAS: fashf},
{ Day: ‘Dsite’, SINCAN:@ViewBag.dsiteTotal51, CONCAN:@ViewBag.dsiteTotal52, NEGOCON:@ViewBag.dsiteTotal41, ING:@ViewBag.dsiteTotal42, FIRMCO:@ViewBag.dsiteTotal43, DISE:@ViewBag.dsiteTotal44, INGMUN:@ViewBag.dsiteTotal45, LICEN:@ViewBag.dsiteTotal46, FAS: fasdsite},
{ Day: ‘Disycon’, SINCAN:@ViewBag.disyconTotal51, CONCAN:@ViewBag.disyconTotal52, NEGOCON:@ViewBag.disyconTotal41, ING:@ViewBag.disyconTotal42, FIRMCO:@ViewBag.disyconTotal43, DISE:@ViewBag.disyconTotal44, INGMUN:@ViewBag.disyconTotal45, LICEN:@ViewBag.disyconTotal46, FAS: fasdisy},
{ Day: ‘Ericsson’, SINCAN:@ViewBag.ericssonTotal51, CONCAN:@ViewBag.ericssonTotal52, NEGOCON:@ViewBag.ericssonTotal41, ING:@ViewBag.ericssonTotal42, FIRMCO:@ViewBag.ericssonTotal43, DISE:@ViewBag.ericssonTotal44, INGMUN:@ViewBag.ericssonTotal45, LICEN:@ViewBag.ericssonTotal46, FAS: faseric},

];

var settings = {
title: “Contratistas”,
description: “Resumen de avance”,
padding: { left: 5, top: 5, right: 5, bottom: 5 },
titlePadding: { left: 90, top: 0, right: 0, bottom: 10 },
source: sampleData,
categoryAxis:
{
dataField: ‘Day’,
showGridLines: false
},
colorScheme: ‘scheme01’,
seriesGroups:
[
{
type: ‘column’,
columnsGapPercent: 30,
seriesGapPercent: 0,
valueAxis:
{
minValue: 0,
maxValue: 70,
unitInterval: 10,
description: ‘Numero de candidatos’
},
series: [
{ dataField: ‘SINCAN’, displayText: ‘5.1 SIN CANDIDATO’ },
{ dataField: ‘CONCAN’, displayText: ‘5.2 CON CANDIDATO’ },
{ dataField: ‘NEGOCON’, displayText: ‘4.1 EN NEGOCIACION CON PROPIETARIO’ },
{ dataField: ‘ING’, displayText: ‘4.2 ING EXP TDP (EA)’ },
{ dataField: ‘FIRMCO’, displayText: ‘4.3 FIRMA CON PROPIETARIO’ },
{ dataField: ‘DISE’, displayText: ‘4.4 EN DISEÑO’ },
{ dataField: ‘INGMUN’, displayText: ‘4.5 ING EXP MUNICIPIO’ },
{ dataField: ‘LICEN’, displayText: ‘4.6 EN LICENCIA’ },
{ dataField: ‘FAS’, displayText: ‘FAS’ }

]
}
]
};

$(‘#chartContainer’).jqxChart(settings);

<div id=’chartContainer’ style=”width:800px; height: 500px” />
<br />
<div id=’chartContainerX’ style=”width:800px; height: 500px” />

[DimitarParticipant]

Hello crballon,

Please modify your HTML as follows and share if this fixes the issue you experience:

<div id='chartContainer' style="width:800px; height: 500px"></div>
<br />
<div id='chartContainerX' style="width:800px; height: 500px"></div>

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[Author]

Posts