ExtJS (5)-Chart of EXT5 charts

Today the system organizes the use of the chart in EXT5 and some problems encountered.

The first is the reference to the chart in EXT5, the chart API will be set in the Ext-all.js in the previous version of 5, but not in the 5, if we only introduce ext-all.js, we will not find the chart API, we also need to introduce the following JS

<script type= "Text/javascript" src= "Ext-5.0.0/build/packages/ext-charts/build/ext-charts.js" ></script >

After successful introduction of the API, we will generate a variety of chart to see that 5 of the call API compared to 4 also has a significant change, the specific call we can directly refer to the official example

Next, let's take a look at some of the problems I have, let's start with the line Chart (Marked), first of all, let's examine the official example:

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M00/57/1F/wKioL1SSR1Xg6KJkAAGfrwTB-cA404.jpg "title=" Line.png "alt=" Wkiol1ssr1xg6kjkaagfrwtb-ca404.jpg "/>

This figure we can run the same as the official sample code, but when we click on the legend on the right side, we have an exception to the display:

The following official example diagram

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M00/57/1F/wKioL1SSSAahURwYAAFasgBpKe8715.jpg "title=" Rightline.png "alt=" Wkiol1sssaahurwyaafasgbpke8715.jpg "/>

The following is our experimental diagram

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M00/57/21/wKiom1SSR4vAZOVdAAGtnT87vsk511.jpg "title=" Wrongline.png "alt=" wkiom1ssr4vazovdaagtnt87vsk511.jpg "/> We found that the red and blue lines that should have been hidden when we clicked on" Firefox "and" Chrome "were not hidden, And stay in the original position, and the Green Line and yellow line with the adjustment of the Y axis upward movement, so that the stay of the red and Blue Line and the Y axis does not correspond.

Let's look at some other exceptions:

650) this.width=650; "src=" http://s3.51cto.com/wyfs02/M02/57/1F/wKioL1SSSxWBgzNNAAGnNlt47bA410.jpg "style=" float: none; "title=" Clustered.png "alt=" Wkiol1sssxwbgznnaagnnlt47ba410.jpg "/>

650) this.width=650; "src=" http://s3.51cto.com/wyfs02/M02/57/22/wKiom1SSSnOjRSWlAAF7V_cVyDQ574.jpg "style=" float: none; "title=" Stacked.png "alt=" Wkiom1sssnojrswlaaf7v_cvydq574.jpg "/>

650) this.width=650; "src=" http://s3.51cto.com/wyfs02/M00/57/1F/wKioL1SSSxXAHkyBAAFUzDztglM787.jpg "style=" float: none; "title=" Pareto.png "alt=" Wkiol1sssxxahkybaafuzdztglm787.jpg "/>

There are similar problems with these bars and lines, which do not exist in the Ext4.2 version, and none of the 5.0 official examples exist. But the API referenced by the official example is not consistent with ours, so the problem is likely to be on the ext-charts.js we've introduced.

or the official version of the ext-charts.js is problematic.

One way to do this is to actively study how the API is introduced in the official example, and to wait for Ext5.0.1 to see if the issue is still present in the new version of the API.

This article is from the "Snow July" blog, please be sure to keep this source http://xuepiaoqiyue.blog.51cto.com/4391594/1591308

ExtJS (5)-Chart of EXT5 charts