hightchart 그림 내 보 내기

5315 단어 chart
보통 하 이 차 트 를 사용 하여 그림 pdf 등 파일 을 내 보 낼 때 저 희 는 exporting.js 를 직접 도입 하면 됩 니 다.
내 보 내기 동작 을 실행 하면 하 이 차 트 서버 에 직접 요청 하고 그림 생 성 등 을 실행 한 다음 클 라 이언 트 에 다운로드 합 니 다.
그러나 이 모든 작업 이 실 행 될 수 있 는 전 제 는 사용자 가 사용 하 는 pc 클 라 이언 트 가 외부 네트워크 에 연결 되 어야 합 니 다.그렇지 않 으 면 다운로드 작업 을 수행 할 수 없습니다.
우 리 는 사용자 정의 모드 를 통 해 전환,이미지 pdf 생 성 등 을 실현 해 야 합 니 다.
 hightchart 홈 페이지 를 조회 합 니 다.highchart 홈 페이지 는 세 가지 서버 모드 를 제공 합 니 다.자바,phop 및 phantomjs(+node)는 우리 asp.net 프로그램 에 대해 상기 세 가 지 를 사용 하면 다른 http 서버 에 의존 하거나 IIS 설정 을 사용 하 더 라 도 상대 적 으로 번 거 롭 습 니 다.다행히 제3자 의.net 플랫폼 의 실현 이 있 습 니 다.
github 주 소 는:https://github.com/imclem/Highcharts-export-module-asp.net
사용 과정 에서 발생 한 작은 문 제 를 기록 합 니 다.
나 는 hightchart theme 를 설정 했다.
//Highcharts.theme = {
        //    colors: ['#058DC7', '#50B432', '#ED561B', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#FFF263', '#6AF9C4'],
        //    chart: {
        //        backgroundColor: {
        //            linearGradient: { x1: 0, y1: 0, x2: 1, y2: 1 },
        //            stops: [
        //                [0, 'rgb(255, 255, 255)'],
        //                [1, 'rgb(240, 240, 255)']
        //            ]
        //        },
        //        borderWidth: 2,
        //        plotBackgroundColor: 'rgba(255, 255, 255, .9)',
        //        plotShadow: true,
        //        plotBorderWidth: 1
        //    },
        //    title: {
        //        style: {
        //            color: '#000',
        //            font: 'bold 16px "Trebuchet MS", Verdana, sans-serif'
        //        }
        //    },
        //    subtitle: {
        //        style: {
        //            color: '#666666',
        //            font: 'bold 12px "Trebuchet MS", Verdana, sans-serif'
        //        }
        //    },
        //    xAxis: {
        //        gridLineWidth: 1,
        //        lineColor: '#000',
        //        tickColor: '#000',
        //        labels: {
        //            style: {
        //                color: '#000',
        //                font: '11px Trebuchet MS, Verdana, sans-serif'
        //            }
        //        },
        //        title: {
        //            style: {
        //                color: '#333',
        //                fontWeight: 'bold',
        //                fontSize: '12px',
        //                fontFamily: 'Trebuchet MS, Verdana, sans-serif'
        //            }
        //        }
        //    },
        //    yAxis: {
        //        minorTickInterval: 'auto',
        //        lineColor: '#000',
        //        lineWidth: 1,
        //        tickWidth: 1,
        //        tickColor: '#000',
        //        labels: {
        //            style: {
        //                color: '#000',
        //                font: '11px Trebuchet MS, Verdana, sans-serif'
        //            },
        //            formatter: function () {
        //                if (/^\d+$/.test(this.value)) {
        //                    return this.value;
        //                } else {
        //                    return "";
        //                }
        //            }
        //        },
        //        min: 0,
        //        title: {
        //            style: {
        //                color: '#333',
        //                fontWeight: 'bold',
        //                fontSize: '12px',
        //                fontFamily: 'Trebuchet MS, Verdana, sans-serif'
        //            }
        //        }
        //    },
        //    legend: {
        //        itemStyle: {
        //            font: '9pt Trebuchet MS, Verdana, sans-serif',
        //            color: 'black'

        //        },
        //        itemHoverStyle: {
        //            color: '#039'
        //        },
        //        itemHiddenStyle: {
        //            color: 'gray'
        //        }
        //    },
        //    labels: {
        //        style: {
        //            color: '#99b'
        //        }
        //    },

        //    navigation: {
        //        buttonOptions: {
        //            theme: {
        //                stroke: '#CCCCCC'
        //            }
        //        }
        //    }
        //};

        //// Apply the theme
        //var highchartsOptions = Highcharts.setOptions(Highcharts.theme);

  
하 이 차 트 theme 에 대한 설정 이 많 으 면 제출 한 xml 파일 이 너무 커서 메모리 에 문제 가 생 길 수 있 습 니 다.

좋은 웹페이지 즐겨찾기