>웹 프론트엔드 >JS 튜토리얼 >그래픽 보고서를 위한 jquery 애플리케이션 구현 코드_jquery

그래픽 보고서를 위한 jquery 애플리케이션 구현 코드_jquery

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB원래의
2016-05-16 18:12:441085검색

렌더링

온라인 데모http://demo.jb51.net/js/jquery_baobiao/index.html
패키지 다운로드http://xiazai.jb51.net/201101 /yuanma/jquery_baobiao.rar
코드 복사 코드는 다음과 같습니다.

🎜>

CSS 스타일



코드 복사{
text-align: center
font-family: Arial, sans-serif
font-size: 12px;
}
a
{
텍스트 장식: 없음
글꼴 두께: 굵게
색상:
}
a:hover
{
색상: #000;
}
div.easyui-tabs
{
여백: auto;
text-align:
너비: 720px ;
}
div.clean
{
테두리: 1px 솔리드 #850000
}
.clean td, .clean th
{
테두리: 2px #bbb;
배경: #ddd;
텍스트 정렬: 중앙
테두리 반경:
}.clean 테이블 {
여백: 자동;
여백-상단: 15px;
여백-하단:
}
.clean caption
{
글꼴 두께
}
.gvChart, .clean
{
테두리: 2px 솔리드 #850000
border-radius:
-moz-border-radius:
너비 : 720px;
여백: 자동;
여백:
}
사전
{
배경:
테두리; -반경: 10px;
-moz-경계-반경: 10px;
}



Html



코드 복사

코드는 다음과 같습니다.




区域报表






















































报表分析


一月

二月

三月

四月

五月

六月

七月

八月

九月

十月

十一月

十二月

实际完成

900

600

327

359

376

398

60

50

404

700

200

500

计划任务

1167

1110

691

165

135

157

139

136

938

1120

55

55




LineChart






















































报表分析


一月

二月

三月

四月

五月

六月

七月

八月

九月

十月

十一月

十二月

实际完成

900

600

327

359

376

398

60

50

404

700

200

500

计划任务

1167

1110

691

165

135

157

139

136

938

1120

55

55




BarChart






















































报表分析


一月

二月

三月

四月

五月

六月

七月

八月

九月

十月

十一月

十二月

实际完成

900

600

327

359

376

398

60

50

404

700

200

500

计划任务

1167

1110

691

165

135

157

139

136

938

1120

55

55




열차트

보고서 분석
;

일>




일>
4월
일>
5월



일>

일>

8월 /일>
9월
일>



11월

12월

tbody>

실제 완료


600

327

359
🎜>

>

200 tr>


예약된 작업

1167



691

td>
135

157

139
/ td>


938
1120

55


55





PieChart




일>
1월
>
2월

3월

4월


5월
일>
6월

7월


8월
일>
9월
일>

10월

11월

12월 🎜>


2010 >

185

359

376 ;

>
0

0





125
;
327




/div>



스타일 및 프레임워크 라이브러리 추가




코드 복사

🎜> 코드는 다음과 같습니다.






> ;

앞으로도 좋은 소식 더 많이 공유하겠습니다. 많은 응원 부탁드립니다.
기사에 있는 코드를 패키지화하고 다운로드하세요.
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.