Ads

2011 Mon 23 May

HighChartsのコラムを自動生成

ま、適当に。moduleはこんな感じ。

package HighCharts::Column;
use strict;
sub draw  {
    my $self = shift;
    # draw header
    my $header = &header($self);    
    my $story;
    my $cnt;    
    # draw data
    foreach my $data(@{$self->{y_values}}) {
        if( $cnt++  ne 0 ) { $story .= "\t\t\t\t,\n"}
        $story .= &story ( $data );
    }
    # drawa footer
    my $footer = &footer;
    my $js = $header.$story.$footer;
    output($self,$js);  
}



sub header {
    my $self = shift;
    my $header = ' ';
    $header = <<_HEADER_;
    var char;
    \$(document).ready(function() {
        chart = new Highcharts.Chart(
        {
            chart: {
                renderTo: 'chart_column_$self->{id}',
                defaultSeriesType: 'column'
            },
            title: {
                text: '$self->{title}'
            },
            subtitle: {
                text: '$self->{subtitle}'
            },
            xAxis:  {
                categories:  [ $self->{x_values} ],
                title:  { 
                    text : '$self->{xaxis_title}'
                }
            },
            yAxis: {        
                title: {
                    text: '$self->{yaxis_title}'
                }
            },

            series: [
_HEADER_

    return($header);
}
sub story {
    my $data = shift;
    my $story =<<_STORY_;
                { 
                    name :'$data->{name}',
                    data : [ $data->{data} ]
                }
_STORY_
    return($story);
}

sub footer{
    my $footer = <<_FOOTER_;
                ]               
        });

    });
_FOOTER_
}

sub output{
    my ($self,$js)=@_;
    open( OUT, ">$self->{file}") or die( "Cannot open file: $self->{'file'}" );

    print OUT $js;

    close OUT;
}

package HighCharts::Column;

で、スクリプトではこんな感じで値を与える。

#!/usr/local/bin/perl

use strict;
use warnings;
use HighCharts::Column;
my @y_data = (
    { name=> 'y1' , data=> "10,3,2"},{ name=> 'y2' , data=> "1,3,2"} 
);

my %sample =  (
    id          => 'テスト',
    title       => 'TiTle',
    subtitle    => 'Sub TiTle',
    x_values    => "10,12,1",
    xaxis_title =>"xaxis_title",
    yaxis_title =>"yaxis_title",
    y_values    => \@y_data,
    file  => "./js/test.js",

);



 HighCharts::Column::draw(\%sample);
 exit;

基本的に外部JSに吐き出す形。複数枚の呼び出しが可能なように複数ファイルかつ、複数rendorとなるようにIDをつけて吐き出す。

まあ、複数ファイルを吐き出すのは簡単だが複数を表示するとブラウザ負荷が結構来るんだけど。

タイトル、サブタイトル、X軸タイトル、Y軸タイトル、Xの値、Yの値とこれだけあれば必要最低限は網羅出来てるかなと思う。元々（仕事用には）、Text:Xslateを使っていてテンプレートもそれで書いてたりはするのだが、適当にハードコート。

オプションで外部JSに他の設定も追加で書けるので装飾も兼ねた部分はそちらでいいのではと割り切った実装としている。

基本自分用のためエラー処理とかないｗ

仕事場ではまあ円グラフもかけるようにしてたりするしすでに物はあるんだが。moduleの作り方をきちんと読んで作っているわけではないのでその辺はゆっくり作りたいかなーとか思ったり。

permlink

category：スクリプト

« なぜライブなのか？ | Main |政府の情報管理について »