Extjs4.0 Chart 속성 중국어 설명
1. Ext.onReady(function () {
2. var win = Ext.create('Ext.Window', {
3. width: 800,
4. height: 600,
5. hidden: false,
6. maximizable: true,
7. title: ' ',
8. renderTo: Ext.getBody(),
9. layout: 'fit',
10. tbar: [{
11. text: 'Reload Data',
12. handler: function() {
13. store1.loadData(generateData());
14. }
15. }],
16. items: {
17. id: 'chartCmp',
18. xtype: 'chart',
19. style: 'background:#000',
20. animate: true,
21. shadow: true,
22. store: store1,
23. axes: [{
24. type: 'Numeric',
25. position: 'left',
26. fields: ['data1'],
27. label: {
28. renderer: Ext.util.Format.numberRenderer('0,0')
29. },
30. title: 'Number',
31. grid: true,
32. minimum: 0
33. }, {
34. type: 'Category',
35. position: 'bottom',
36. fields: ['name'],
37. title: 'Month'
38. }],
39. series: [{
40. type: 'column',
41. axis: 'left',
42. highlight: true,
43. tips: {
44. trackMouse: true,
45. width: 140,
46. height: 28,
47. renderer: function(storeItem, item) {
48. this.setTitle(storeItem.get('name') + ': ' + storeItem.get('data1') + '$' );
49. }
50. },
51. label: {
52. display: 'insideEnd',
53. 'text-anchor': 'middle',
54. field: 'data1',
55. renderer: Ext.util.Format.numberRenderer('0'),
56. orientation: 'vertical',
57. color: '#333'
58. },
59. xField: 'name',
60. yField: 'data1'
61. }]
62. }
63. });
64. });
axes: 좌표를 설정하는 데 사용됩니다. 여러 개의 좌표를 설정할 수 있습니다.
type: 좌표 유형을 설정합니다.일반적으로 Numeric, Category를 사용합니다.
position: 좌표의 위치를 설정합니다. 예를 들어 상하좌우
fields: 좌표에 표시된 값을 설정하기 위해 여러 필드를 설정할 수 있습니다.사실 이 설정은 시리즈의 yFiled 설정 항목과 관계가 없습니다.
label: 문자의 표시 방식을 설정할 수 있습니다.기본 표시 필드의 값입니다.예를 들어 label을 설정하여 일정한 도수를 회전시킨다
label: { rotate: { degrees: 315 } }
title: 좌표 설정에 표시할 title
grid: 격자 스타일을 설정합니다.예를 들어 격자의 투명도, 스타일 등을 설정한다.
grid: {//격자 색상 값 설정odd: {opacity: 1, fill:'#ddd', stroke:'#bbb','stroke-width': 1} }
minimum: 좌표의 최소값을 설정할 수 있습니다.당연히 대응하는 최대치가 있을 것이다.majorTickSteps(주 눈금, 설정은 모두 몇 개의 눈금), minorTickSteps(차 눈금, 각 주에서 짧은 눈금을 그릴 수 있습니다. 예를 들어 10을 설정하면 숫자가 10이 증가하지 않고 세션이 한 번 눈금)
series: 차트 구성
type: 그래프의 종류를 설정합니다. 그래프는 여러 종류가 있습니다.각 차트에는 고유한 구성 항목이 있습니다.
axis: 어느 좌표에 비해.좌표가 여러 개, 도표의 높이, 총 참조가 있기 때문이다.
highlight: 마우스가 도표 위로 이동하고 밝은지 설정합니다.하지만 이 반응은 매우 느리다.
tips: 마우스가 도표로 이동할 때의 알림 정보 설정
label: 도표에 표시된 문자를 설정합니다.문자의 위치, 스타일을 설정할 수 있습니다.그러나 모든 도표에 이 설정 항목이 있는 것은 아니다.
xField: x 좌표가 연결된 필드를 설정합니다.axes가 좌표의 값을 설정했기 때문에 이 필드에 연결된 값은 axes의 좌표 값에 있어야 합니다.
yField: y 좌표가 연결된 필드를 설정합니다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.