DevExpress でのピボットグリッドのイメージ出力設定（PNG）

DevExpress でのピボットグリッド（ASPxPivotGrid）のイメージ出力設定（PNG）のサンプルです。

「ファイル出力」は9パターン可能です。
1パターン：エクセル（XLSX）
2パターン：エクセル（XLS）
3パターン：テキスト（TEXT）
4パターン：ワード（RTF）
5パターン：アクロバット（PDF）
6パターン：Webページ（MHT）
7パターン：イメージ（PNG）
8パターン：Webページ（HTML）
9パターン：テキスト（CSV）

現状の画面デザインはこのようになっています。

事前設定のピボットグリッドエクスポーター（ASPxPivotGridExporter）手順は、
過去ブログの「DevExpress でのピボットグリッドのエクセル出力設定（XLSX）」を参照して下さい。

＜ピボットグリッドのイメージ出力設定（PNG）＞

・ボタン（ASPxButton）を配置します。

・「ASPxButton」に対して「Theme=”RedWine”」、「Text=”イメージ出力（PNG）”」を設定します。

【サンプルプログラム】

<div>
    <dx:ASPxButton ID="ASPxButton1" runat="server" Text="エクセル出力（XLSX）" 
        Theme="RedWine">
    </dx:ASPxButton>
    <dx:ASPxButton ID="ASPxButton2" runat="server" Text="エクセル出力（XLS）" 
        Theme="RedWine">
    </dx:ASPxButton>
    <dx:ASPxButton ID="ASPxButton3" runat="server" Text="テキスト出力（TEXT）" 
        Theme="RedWine">
    </dx:ASPxButton>
    <dx:ASPxButton ID="ASPxButton4" runat="server" Text="ワード出力（RTF）" 
        Theme="RedWine">
    </dx:ASPxButton>
    <dx:ASPxButton ID="ASPxButton5" runat="server" Text="アクロバット出力（PDF）" 
        Theme="RedWine">
    </dx:ASPxButton>
    <dx:ASPxButton ID="ASPxButton6" runat="server" Text="Webページ出力（MHT）" 
        Theme="RedWine">
    </dx:ASPxButton>
    <dx:ASPxButton ID="ASPxButton7" runat="server" Text="イメージ出力（PNG）" 
        Theme="RedWine">
    </dx:ASPxButton>
</div>
<div>
    <dx:ASPxPivotGrid ID="ASPxPivotGrid1" runat="server" ClientIDMode="AutoID" 
        DataSourceID="XpoDataSource1" EnableTheming="True" Theme="RedWine" 
        Caption="売上一覧（ピボットグリッド）">
        <Fields>
            <dx:PivotGridField ID="fieldKINGAKU" Area="DataArea" AreaIndex="0" 
                FieldName="KINGAKU" Caption="金額" CellFormat-FormatString="#,###" 
                CellFormat-FormatType="Numeric">
            </dx:PivotGridField>
            <dx:PivotGridField ID="fieldAQUREXNAME" Area="RowArea" AreaIndex="0" 
                FieldName="AQUREX_NAME" Caption="担当者">
            </dx:PivotGridField>
            <dx:PivotGridField ID="fieldPROJECT" Area="RowArea" AreaIndex="1" 
                FieldName="PROJECT" Caption="案件" TotalValueFormat-FormatString="{0} 合計" 
                TotalValueFormat-FormatType="Custom">
            </dx:PivotGridField>
            <dx:PivotGridField ID="fieldTORIHIKICHIHOCHIHOMEI" Area="RowArea" AreaIndex="2" 
                FieldName="TORIHIKI_CHIHO.CHIHOMEI" Caption="取引先場所" 
                TotalValueFormat-FormatString="{0} 合計" TotalValueFormat-FormatType="Custom">
            </dx:PivotGridField>
            <dx:PivotGridField ID="fieldTORIHIKICOMPANY" Area="RowArea" AreaIndex="3" 
                FieldName="TORIHIKI_COMPANY" Caption="取引先名">
            </dx:PivotGridField>
            <dx:PivotGridField ID="fieldTORIHIKITANTO" Area="RowArea" AreaIndex="4" 
                FieldName="TORIHIKI_TANTO" Visible="False" Caption="取引先担当者">
            </dx:PivotGridField>
            <dx:PivotGridField ID="fieldSALESEDATE" Area="ColumnArea" AreaIndex="0" 
                FieldName="SALESE_DATE" Caption="売上年" GroupInterval="DateYear" 
                UnboundFieldName="fieldSALESEDATE" TotalValueFormat-FormatString="{0}年 合計" 
                TotalValueFormat-FormatType="Custom">
            </dx:PivotGridField>
            <dx:PivotGridField ID="fieldSALESEDATE1" Area="ColumnArea" AreaIndex="1" 
                FieldName="SALESE_DATE" Caption="売上月" GroupInterval="DateMonth" 
                UnboundFieldName="fieldSALESEDATE1">
            </dx:PivotGridField>
            <dx:PivotGridField ID="fieldSALESEDATE2" AreaIndex="0" FieldName="SALESE_DATE" 
                Caption="売上年" GroupInterval="DateYear" UnboundFieldName="fieldSALESEDATE2">
            </dx:PivotGridField>
            <dx:PivotGridField ID="fieldSALESEDATE3" AreaIndex="1" FieldName="SALESE_DATE" 
                Caption="売上月" GroupInterval="DateMonth" 
                UnboundFieldName="fieldSALESEDATE3">
            </dx:PivotGridField>
        </Fields>
        <OptionsPager Position="Bottom">
            <AllButton Visible="True">
            </AllButton>
            <FirstPageButton Visible="True">
            </FirstPageButton>
            <LastPageButton Visible="True">
            </LastPageButton>
            <PageSizeItemSettings AllItemText="全件表示" Caption="表示件数：" Items="5, 10, 15, 20" 
                ShowAllItem="True" Visible="True">
            </PageSizeItemSettings>
        </OptionsPager>
        <Styles>
            <FieldValueStyle Wrap="False">
            </FieldValueStyle>
        </Styles>
        <StylesPager>
            <PageSizeItem Width="50px">
                <ComboBoxStyle>
                    <ItemStyle BackColor="#EED9E3" Wrap="False" />
                </ComboBoxStyle>
            </PageSizeItem>
        </StylesPager>
    </dx:ASPxPivotGrid>
</div>
<div>
    <dx:XpoDataSource ID="XpoDataSource1" runat="server" 
        TypeName="Sample_07.SAMPLE.SALESE_INFO">
    </dx:XpoDataSource>
</div>
<div>
    <dx:ASPxPivotGridExporter ID="ASPxPivotGridExporter1" runat="server" 
        ASPxPivotGridID="ASPxPivotGrid1">
    </dx:ASPxPivotGridExporter>
</div>

100

<div>

<dx:ASPxButton ID="ASPxButton1" runat="server" Text="エクセル出力（XLSX）"

Theme="RedWine">

</dx:ASPxButton>

<dx:ASPxButton ID="ASPxButton2" runat="server" Text="エクセル出力（XLS）"

Theme="RedWine">

</dx:ASPxButton>

<dx:ASPxButton ID="ASPxButton3" runat="server" Text="テキスト出力（TEXT）"

Theme="RedWine">

</dx:ASPxButton>

<dx:ASPxButton ID="ASPxButton4" runat="server" Text="ワード出力（RTF）"

Theme="RedWine">

</dx:ASPxButton>

<dx:ASPxButton ID="ASPxButton5" runat="server" Text="アクロバット出力（PDF）"

Theme="RedWine">

</dx:ASPxButton>

<dx:ASPxButton ID="ASPxButton6" runat="server" Text="Webページ出力（MHT）"

Theme="RedWine">

</dx:ASPxButton>

<dx:ASPxButton ID="ASPxButton7" runat="server" Text="イメージ出力（PNG）"

Theme="RedWine">

</dx:ASPxButton>

</div>

<div>

<dx:ASPxPivotGrid ID="ASPxPivotGrid1" runat="server" ClientIDMode="AutoID"

DataSourceID="XpoDataSource1" EnableTheming="True" Theme="RedWine"

Caption="売上一覧（ピボットグリッド）">

<dx:PivotGridField ID="fieldKINGAKU" Area="DataArea" AreaIndex="0"

FieldName="KINGAKU" Caption="金額" CellFormat-FormatString="#,###"

CellFormat-FormatType="Numeric">

</dx:PivotGridField>

<dx:PivotGridField ID="fieldAQUREXNAME" Area="RowArea" AreaIndex="0"

FieldName="AQUREX_NAME" Caption="担当者">

</dx:PivotGridField>

<dx:PivotGridField ID="fieldPROJECT" Area="RowArea" AreaIndex="1"

FieldName="PROJECT" Caption="案件" TotalValueFormat-FormatString="{0} 合計"

TotalValueFormat-FormatType="Custom">

</dx:PivotGridField>

<dx:PivotGridField ID="fieldTORIHIKICHIHOCHIHOMEI" Area="RowArea" AreaIndex="2"

FieldName="TORIHIKI_CHIHO.CHIHOMEI" Caption="取引先場所"

TotalValueFormat-FormatString="{0} 合計" TotalValueFormat-FormatType="Custom">

</dx:PivotGridField>

<dx:PivotGridField ID="fieldTORIHIKICOMPANY" Area="RowArea" AreaIndex="3"

FieldName="TORIHIKI_COMPANY" Caption="取引先名">

</dx:PivotGridField>

<dx:PivotGridField ID="fieldTORIHIKITANTO" Area="RowArea" AreaIndex="4"

FieldName="TORIHIKI_TANTO" Visible="False" Caption="取引先担当者">

</dx:PivotGridField>

<dx:PivotGridField ID="fieldSALESEDATE" Area="ColumnArea" AreaIndex="0"

FieldName="SALESE_DATE" Caption="売上年" GroupInterval="DateYear"

UnboundFieldName="fieldSALESEDATE" TotalValueFormat-FormatString="{0}年合計"

TotalValueFormat-FormatType="Custom">

</dx:PivotGridField>

<dx:PivotGridField ID="fieldSALESEDATE1" Area="ColumnArea" AreaIndex="1"

FieldName="SALESE_DATE" Caption="売上月" GroupInterval="DateMonth"

UnboundFieldName="fieldSALESEDATE1">

</dx:PivotGridField>

<dx:PivotGridField ID="fieldSALESEDATE2" AreaIndex="0" FieldName="SALESE_DATE"

Caption="売上年" GroupInterval="DateYear" UnboundFieldName="fieldSALESEDATE2">

</dx:PivotGridField>

<dx:PivotGridField ID="fieldSALESEDATE3" AreaIndex="1" FieldName="SALESE_DATE"

Caption="売上月" GroupInterval="DateMonth"

UnboundFieldName="fieldSALESEDATE3">

</dx:PivotGridField>

</Fields>

</AllButton>

</FirstPageButton>

</LastPageButton>

<PageSizeItemSettings AllItemText="全件表示" Caption="表示件数：" Items="5, 10, 15, 20"

ShowAllItem="True" Visible="True">

</PageSizeItemSettings>

</OptionsPager>

</FieldValueStyle>

</Styles>

</ComboBoxStyle>

</PageSizeItem>

</StylesPager>

</dx:ASPxPivotGrid>

</div>

<div>

<dx:XpoDataSource ID="XpoDataSource1" runat="server"

TypeName="Sample_07.SAMPLE.SALESE_INFO">

</dx:XpoDataSource>

</div>

<div>

<dx:ASPxPivotGridExporter ID="ASPxPivotGridExporter1" runat="server"

ASPxPivotGridID="ASPxPivotGrid1">

</dx:ASPxPivotGridExporter>

</div>

【サンプルプログラム（VB.net）】

Private Sub ASPxButton7_Click(sender As Object, e As System.EventArgs) Handles ASPxButton7.Click
    ASPxPivotGridExporter1.ExportImageToResponse("ピボットグリッド出力結果")
End Sub

Private Sub ASPxButton7_Click(sender As Object, e As System.EventArgs) Handles ASPxButton7.Click

ASPxPivotGridExporter1.ExportImageToResponse("ピボットグリッド出力結果")

End Sub

それでは、実行して動作確認を行います。

・「イメージ出力（PNG）」ボタンを押下します。

↓

無事にピボットグリッド（ASPxPivotGrid）のイメージ出力設定（PNG）が出来ました。

MENU

最近の投稿

人気記事

MENU

DevExpress でのピボットグリッドのイメージ出力設定（PNG）

関連記事はこちら:

最近の投稿

人気記事