fusioncarts 에서 클 라 이언 트 와 서버 로 그림 내 보 내기
14253 단어 FusionCharts
<
chart
palette
='4'
caption
='d'
xAxisName
='d'
yAxisName
='fdsfds'
showValues
='0'
decimals
='0'
formatNumberScale
='0'
baseFontSize
='12'
useRoundEdges
='1'
rotateYAxisName
='0'
exportEnabled
='1'
exportAtClient
='0'
exportAction
='save'
exportHandler
='http://localhost:49905/funsion/FusionCharts/ExportHandlers/ASP_Net/FCExporter.aspx'
>
<
set
label
='d'
value
='462'
/>
<
set
label
='Feb'
value
='857'
/>
<
set
label
='Mar'
value
='671'
/>
<
set
label
='Apr'
value
='494'
/>
<
set
label
='May'
value
='761'
/>
<
set
label
='Jun'
value
='960'
/>
</
chart
>
<?xml version="1.0" encoding="iso-8859-1"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>FusionCharts v3 Documentation</title>
<link rel="stylesheet" href="../Contents/Style.css" type="text/css" />
<script language="JavaScript" src="../JSClass/FusionCharts.js"></script>
<script src="../JSClass/FusionChartsExportComponent.js" type="text/javascript"></script>
<script type="text/javascript" src="http://www.cnblogs.com/Scripts/jquery-1.4.1.js"></script>
<script type="text/javascript">
function ExportMyChart() {
var chartObject = getChartFromId('ChartId');
//chartObject.print();
chartObject.exportChart({ exportAtClient: '0', exportFormat: 'PDF' });
}
function FC_Exported(objRtn) {
if (objRtn.statusCode == "1") {
alert("The chart was successfully saved. Its DOM Id is " + objRtn.DOMId);
} else {
alert("There was an error saving the chart. Error message: " + objRtn.statusMessage + ". Its DOM Id is " + objRtn.DOMId);
}
}
$(document).ready(function () {
})
setTimeout("ExportMyChart()", 3000);
</script>
</head>
<body>
<input type="button" onclick="ExportMyChart()" value="Export" />
<table width="98%" border="0" cellspacing="0" cellpadding="3" align="center">
<tr>
<td valign="top" class="text" align="center"> <div id="chartdiv" align="center">
FusionCharts. </div>
<script type="text/javascript">
var chart = new FusionCharts("../Charts/Column2D.swf", "ChartId", "500", "300", "0"," 1");
chart.setDataURL("Data/Column2D.xml");
chart.render("chartdiv");
</script> </td>
</tr>
<tr>
<td valign="top" class="text" align="center"> </td>
</tr>
<tr>
<td valign="top" class="text" align="center"><a href="Data/Column2D.xml" target="_blank"><img src="../Contents/Images/BtnViewXML.gif" alt="View XML for the above chart" width="75" height="25" border="0" /></a></td>
</tr>
</table>
<script type="text/javascript">
</script>
</body>
</html>
기능 특성 애니메이션 데 이 터 를 애니메이션 으로 표시 할 지 여부 입 니 다.기본 값 은 1(True)show Names 입 니 다. 가로 좌표 축(x 축)탭 이름 을 보일 지 여부 rotateNames 디 스 플레이 탭 을 회전 할 지 여부 입 니 다.기본 값 은 0(False)입 니 다.show Values 를 가로로 표시 합 니 다. 도표 에 대응 하 는 데이터 값 을 표시 할 지 여부 입 니 다.기본 값 은 1(True)yAxis MinValue 입 니 다. 세로 축(y 축)최소 값,디지털 yAxis MaxValue 지정 세로 축(y 축)최대 값,숫자 쇼 Limits 지정 도표 제한 값(y 축 최대,최소 값)을 표시 할 지 여부 입 니 다.기본 값 은 1(True)showColumnShadow 입 니 다. 각 막대 그래프 사이 의 그림 자 를 표시 할 지 여부(기둥 그림 이 함께 있 으 면)show AlternateHGridColor 다른 색상 의 도표 제목 과 축 이름 caption 을 표시 할 지 여부 도표 주 제목 subCaption 도표 부제 xAxis Name 가로 좌표 축(x 축)이름 yAxis Name 세로 좌표 축(y 축)이름 imageSave='1' 이미지 이미지 저장 여부 SaveURL='Path/FusionChartsSave.jsp'이미지 경로
hoverCapSepChar=','。기둥 위 에 마 우 스 를 올 렸 을 때 표시 되 는 알림 메시지 의 구분자 쇼 hovercap='1' 마 우 스 를 기둥 위 에 올 렸 을 때 알림 정보 hoverCapbgColor='ffff'알림 정보 배경 색상 도표 와 캔버스 스타일 bgColor 를 표시 할 지 여부 도표 배경 색,6 비트 16 진 색상 값 canvasbgColor 캔버스 배경 색,6 비트 16 진 색상 값 canvasbgAlpha 캔버스 투명도,[0-100]canvasBorderColor 캔버스 테두리 색상,6 비트 16 진 색상 값 canvasBorder Thickness 캔버스 테두리 두께,[0-100]shadowAlpha 투영 투명도,[0-100]show Legend 시리즈 이름 을 표시 할 지 여부 입 니 다.기본 값 은 1(True)입 니 다.
글꼴 속성 baseFont 도표 글꼴 스타일 baseFontSize 도표 글꼴 크기 baseFontColor 그래프 글꼴 색상,6 비트 16 진수 색상 값 outCnvBaseFont 그래프 캔버스 이외 의 글꼴 스타일 outCnvBaseFontSize 그래프 캔버스 이외 의 글꼴 크기 outCnvBaseFontColor 그래프 캔버스 이외 의 글꼴 색상,6 비트 16 진수 색상 값
파 티 션 라인 과 격자 numDivLines 캔버스 내부 수평 분할 라인 수,디지털 divLine Color 수평 분할 선 색상,6 비트 16 진 색상 값 divLine Thickness 수평 분할 선 두께,[1-5]divLine Alpha 수평 분할 선 투명도,[0-100]show AlternateHGridColor 가로 격자 대 에서 색상 을 바 꿀 지 여부 입 니 다.기본 값 은 0(False)alternateHGridColor 입 니 다. 가로 격자 대 교체 색상,6 비트 16 진 색상 값 alternateHGridAlpha 가로 격자 대의 투명도,[0-100]쇼 DivLine Values Div 줄 의 값 을 표시 하 시 겠 습 니까?기본 값 입 니까?numVDivLines 캔버스 내부 수직 분할 라인 수,디지털 vDivLine Color 수직 분할 선 색상,6 비트 16 진 색상 값 vDivLine Thickness 수직 분할 선 두께,[1-5]vDivLineAlpha 수직 분할 선 투명도,[0-100]show AlternativeGridColor 세로 격자 대 에서 색상 을 바 꿀 지 여부 입 니 다.기본 값 은 0(False)alternativeGridColor 입 니 다. 세로 격자 대 교체 색상,6 비트 16 진 색상 값 alternateVGridAlpha 세로 격자 대의 투명도,[0-100]
숫자 형식 numberPrefix 숫자 접두사 숫자 추가 Suffix 숫자 접미사 추가 % '%25'/(톤)은'%ef%bc%88%e5%90%a8%ef%bc%89'(Server.UrlEncode 인 코딩)formatNumberScale 입 니 다. 숫자 를 포맷 할 지 여부 입 니 다.기본 값 은 1(True)입 니 다.자동 으로 K(천)또는 M(백만)을 추가 합 니 다.0 을 가 져 오 면 K 나 M decimal Precision 을 추가 하지 않 습 니 다. 소수 자리 의 자릿수 를 지정 합 니 다.[0-10] 예 를 들 어='0'추출 divLine DecimalPrecision 수평 분할 선의 값 작은 수의 자릿수 를 지정 합 니 다.[0-10]limits Decimal Precision y 축 최대,최소 값 의 작은 수의 자릿수 를 지정 합 니 다.[0-10]formatnumber 쉼표 로 숫자(천 자리,백만 자리)를 구분 하고 기본 값 은 1(True)입 니 다.0 을 가 져 오 면 구분자 decimalSeparator 를 추가 하지 않 습 니 다. 소수 구분 자 를 지정 합 니 다.기본 값 은'thousandSeparator'입 니 다. 천 분 위 구분자 지정,기본 값 은','
도구-tip/Hover 제목 showhovercap 서 스 펜 션 설명 상 자 를 표시 할 지 여부 입 니 다.기본 값 은 1(True)hoverCapBgColor 입 니 다. 서 스 펜 션 설명 상자 배경 색,6 비트 16 진 색상 값 hoverCapBorderColor 서 스 펜 션 설명 상자 테두리 색상,6 비트 16 진 색상 값 hoverCapSepChar 서 스 펜 션 설명 상자 의 값 과 값 사이 의 구분 자 를 지정 합 니 다.기본 값 은','입 니 다.
접 는 선 그림 의 매개 변수 lineThickness 접 는 선의 두께 anchorRadius 접선 노드 반경,디지털 anchorBgAlpha 접선 노드 투명도,[0-100]anchorBgColor 접 는 선 노드 충전 색상,6 비트 16 진 색상 값 anchorBorderColor 접선 노드 테두리 색상,6 비트 16 진수 색상 값
set 태그 에 사용 할 인자 value 데이터 값 color 색상 링크 링크(이 창 은[Url]을 열 고 새 창 은[n-Url]을 열 고 JS 함수[JavaScript:함수]를 호출 합 니 다)name 가로 좌표 축 라벨 이름
showFCMenuItem='0'오른쪽 단 추 를 누 르 면 표시 되 지 않 습 니 다
1. varmyChart= newFusionCharts("../FusionCharts/FCF_Column3D.swf", "myChartId", "600", " 500"); 첫 번 째 인 자 는 SWF 파일 의 주소 입 니 다.두 번 째 는 도형 의 id 입 니 다.이 id 는 당신 이 마음대로 뭐라고 부 를 수 있 지만,주의해 야 합 니 다.뒤에서 우리 가 한 페이지 에 여러 개의 도형 이 있다 고 말 할 때,이 id 는 반드시 유일한 것 입 니 다.세 번 째 매개 변 수 는 도형 의 너비 이다.네 번 째 매개 변 수 는 도형 의 높이 이다.우 리 는 데이터 파일 의 주 소 를 설정 해 야 한다.1. myChart.setDataURL("Data.xml"); 마지막 으로 우 리 는 도형 을 지정 한 곳 에 과장 했다.1. myChart.render("chartdiv"); "chartdiv 는 바로 앞의 DIV 의 id 입 니 다.이것 은 도형 render 를'chartdiv'로 표시 합 니 다.현재 JSchart.html 를 실행 하면 Chart.html 와 같은 효 과 를 볼 수 있 습 니 다.자 바스 크 립 트 를 사용 하여 도형 을 불 러 오 는 것 이 더욱 편리 하고 직관 적 인 것 이 분명 하 다.
새 창 에서 페이지 를 열 려 면 연결 앞 에'n-'만 추가 하면 됩 니 다.아래 코드 와 같 습 니 다.1.
XML 데이터 노드 와 상용 속성 상세 설명 caption='제목'subcaption='하위 제목'clickURL='abc.jsp'전체 도 표를 클릭 할 때 abc.jsp xAxis Name=부서'numberPrefix='¥'데이터 접두사 단위 numberSuffix='개'데이터 접두사 단위 Decimals='2'는 두 개의 소 수 를 유지 합 니 다.반올림 forceDecimals='2'는 두 개의 소 수 를 강제로 보류 합 니 다.5.1 에서 5.10 yAxis Name='완 성률'로 전환 할 때 한자 한 자 를 사용 할 때 속성 을 추가 해 야 합 니 다.rotateYaxis Name='1'show Values='1'yAxis MaxValue='100'은 백분율 에 자주 사용 되 는 bgColor='99999,FFFFFF'그 라 데 이 션 bgColor='999999'단색 useRoundEdge='1'광선 효과 baseFont='송 체'baseFontSize='12'baseFontColor='3333333'