An issue in which the x-axis statistic time interval appears in the Echarts column chart

The problem with the x-axis statistic time interval appears in the column chart using Echarts today:

The data is all taken, and the JSON array is complete, and it's time to show

Such as:

------------------------------------------------------Div for JSP page code

<div class= "F-r w-b45" >
<div id= "Promonthcount" style= "min-width:310px; margin:0 auto;padding-top:50px; " ></div>
<span class= "Title-ind-bule" > Project Engineering Growth </span>
<div id= "pro_tips" style= "Display:none" class= "index-tips" ><span class= "Icon-bule-tips" ></span> Statistics will be available for you at the moment when there is a myriad of data </div>
</div>

------------------------------------------------------JS Code

var mychart;

var Arrprocount;

var procountmonth;

var procount=0;

function Getprocount () {
var result = Doajax ("POST", Web_url + '/views/getprocount ', {}, False);
result = eval ("(" + result + ")");
var results = Result.results;
Arrprocount = [];
Procountmonth = [];

for (var i = 0, j = results.length; I < J; i++) {
var curr_result = results[i];
var curr_count = parseint (curr_result.quantity);
var Curr_arr = [Curr_result.countmonth, Curr_count];

Arrprocount.push (Curr_count);
Procountmonth.push (Curr_result.countmonth);

Procount + = Curr_count;
}
}

function Getprocountchart () {
if (Procount = = 0) {
$ ("#pro_tips"). Show ();
Return
}
$ ("#proMonthCount"). CSS ("height", 400);

alert (procountmonth);
alert (Arrprocount);
Initialize the Echarts chart based on the prepared DOM
MyChart = Echarts.init (document.getElementById (' Promonthcount '));
var option = {
Title: {
Text: ' Project Engineering growth '
},
ToolTip: {
Trigger: ' axis '
},
Legend: {
data:[' Project Engineering Number ']
},
Toolbox: {
Show:true,
Feature: {
DataView: {show:true, readonly:false},
Magictype: {show:true, type: [' line ', ' Bar ']},
Restore: {show:true},
Saveasimage: {show:true}
}
},
Calculable:true,
Xaxis: [
{
Type: ' Category ',
Data:procountmonth,

}
],
YAxis: [
{
Type: ' Value '
}
],
Series: [

{
Name: ' Project Engineering number ',
Type: ' Bar ',
Data:arrprocount
}
]
};
Loading data for Echarts objects
mychart.setoption (option);

}

-------------------------------------------------------------------------------------

Later through constant adjustment, look at the API, constantly looking for reasons, add a few lines of code just fine

------------------------------------------------Modify the code as follows:

var mychart;

var Arrprocount;

var procountmonth;

var procount=0;

function Getprocount () {
var result = Doajax ("POST", Web_url + '/views/getprocount ', {}, False);
result = eval ("(" + result + ")");
var results = Result.results;
Arrprocount = [];
Procountmonth = [];

for (var i = 0, j = results.length; I < J; i++) {
var curr_result = results[i];
var curr_count = parseint (curr_result.quantity);
var Curr_arr = [Curr_result.countmonth, Curr_count];

Arrprocount.push (Curr_count);
Procountmonth.push (Curr_result.countmonth);

Procount + = Curr_count;
}
}

function Getprocountchart () {
if (Procount = = 0) {
$ ("#pro_tips"). Show ();
Return
}
$ ("#proMonthCount"). CSS ("height", 400);

alert (procountmonth);
alert (Arrprocount);
Initialize the Echarts chart based on the prepared DOM
MyChart = Echarts.init (document.getElementById (' Promonthcount '));
var option = {
Title: {
Text: ' Project Engineering growth '
},
ToolTip: {
Trigger: ' axis '
},
Legend: {
data:[' Project Engineering Number ']
},
Toolbox: {
Show:true,
Feature: {
DataView: {show:true, readonly:false},
Magictype: {show:true, type: [' line ', ' Bar ']},
Restore: {show:true},
Saveasimage: {show:true}
}
},
Calculable:true,
Xaxis: [
{
Type: ' Category ',
Data:procountmonth,
boundarygap:true,
Show:true,
axislabel:{
interval:0
                    }
}
],
YAxis: [
{
Type: ' Value '
}
],
Series: [

{
Name: ' Project Engineering number ',
Type: ' Bar ',
Data:arrprocount
}
]
};
Loading data for Echarts objects
mychart.setoption (option);

}

----------------------------------------------------------------

The solution to this problem is documented here.

An issue in which the x-axis statistic time interval appears in the Echarts column chart