Como a versão TeeChart VCL é amplamente utilizada em uma variedade de ambientes de desenvolvimento e é bem reconhecida, a empresa espanhola Steema Software SL desenvolveu o TeeChart Pro ActiveX em outubro de 1997. É sem dúvida uma boa notícia para o modelo de desenvolvimento B/S. Como só precisa ser instalado no lado do servidor, o cliente não precisa instalar outro software. Os gráficos estatísticos podem ser exibidos em um navegador geral. lançado, mais uma vez ganhou grande popularidade.
A seguir, apresentaremos as propriedades e aplicações comuns dos componentes ActiveX do TeeChart Pro V5 baseados na tecnologia ASP.
Vejamos primeiro um exemplo de gráfico de barras bidimensional usando o componente TeeChart para exibir "vendas trimestrais":
<HTML><BODY>
<%'-----------TeeChartEg.asp--- - --------------------
Set TChart1 = CreateObject("TeeChart.TChart")
TChart1.Header.Text(0)="Estatísticas Trimestrais de Vendas"
TChart1.AddSeries( 1)
TChart1.Aspect.View3D=0
TChart1.Series(0).Limpar
TChart1.Series(0).Adicionar 180, "1 Trimestre",RGB(35,70,128)
TChart1.Series(0).Adicionar 240, "2 Trimestre",RGB(255,80,128)
TChart1.Series(0).Adicionar 210, "3 Trimestre",&HFACE87
TChart1.Series(0).Adicionar 280, "4 Trimestre",16777215
TChart1.Export.SaveToJPEGFile server.mappath( "MyChart.jpg"),False,JPEGBestQuality,100,TChart1.Width, TChart1.Height
Set TChart1 = nada
%>
<img src="MyChart.jpg">
</BODY></HTML>
1) Igual a outro ASP componentes O método de uso é o mesmo, primeiro crie o objeto.
Set TChart1 = CreateObject("TeeChart.TChart")
2) Use suas propriedades para exibir um gráfico estatístico estático.
TChart1.Header.Text(0)="Estatísticas Trimestrais de Vendas"
...
TChart1.Series(0).Add 210, "3º Trimestre",&HFACE87
TChart1.Series(0).Add 280, "4º Trimestre",16777215
3 ) Gerar arquivo gráfico estatístico
TChart1.Export.SaveToJPEGFile server.mappath("MyChart.jpg"),False,JPEGBestQuality,100,TChart1.Width, TChart1.Height
4) Liberar o objeto
Definir TChart1 = nada
Muitos atributos da classe de objeto em o exemplo acima Todos esses são valores padrão e podemos adicionar configurações de acordo com circunstâncias específicas. A seguir está uma introdução detalhada a outras propriedades comuns do componente TeeChart (listadas na forma de comentários do programa)
<HTML> <HEAD><TITLE>Introdução aos métodos de propriedade do objeto TeeChart</TITLE></HEAD>
< BODY>
<%
Set TChart1 = CreateObject("TeeChart.TChart")
TChart1.Height = 440 'A altura de todo o gráfico
TChart1.Width = 500 'A largura de todo o gráfico'TChart1.Header.Text.Clear
'
TChart1. Header.Text.Add "Estatísticas Trimestrais de Vendas" 'Título do gráfico, o método também pode estar na forma de TChart1.Header.Text(0)="title"
TChart1.Header.Font.Size = 22 'Tamanho da fonte do título
TChart1. Header.Font.Bold = True 'Se a fonte do título está em
negritoTChart1 .Header.Font.Italic = True ' Se a fonte do título está em itálico
TChart1.Panel.MarginLeft = 3 ' A margem esquerda do gráfico
TChart1.Panel.Gradient.Visible = True ' Se existe uma cor de fundo
TChart1.Panel.Gradient.StartColor = &HB3DEF ' A parte inferior do gráfico Cor inicial
TChart1.Panel.Gradient.EndColor = &HFACE87 ' Cor final do gráfico
TChart1.Panel.BevelWidth = 0 ' Largura do recuo da tela
TChart1.AddSeries(0) ' A forma de exibir gráficos, o intervalo de valores é 1 ~ 39
TChart1.Aspect.View3D = False ' False representa gráficos 2D, True representa gráficos 3D
TChart1.Aspect.Chart3DPercent = 10 ' Se for é um gráfico 3D, representa sua inclinação
TChart1.Aspect.Zoom = 100 ' Proporção de exibição gráfica
TChart1.Aspect.Orthogonal = TRUE 'Se o gráfico 3D for girado lateralmente
TChart1.Aspect.Rotation = -20 'Se o gráfico for girado lateralmente , o ângulo de rotação horizontal é -360 ~ 360
TChart1.Aspect.Elevation = 0 'Se o gráfico for girado lateralmente, gire para frente e para trás Ângulo -360 ~ 360
TChart1.Aspect.Perspective = 0 ' Grau de agregação centrípeta de gráficos 3D
TChart1.Aspect .Chart3DPercent = 20 ' Espessura do gráfico 3D 1~100
TChart1.Walls.Bottom.Size = 5 ' Se for um gráfico 3D indica sua espessura de Abscissa
TChart1.Walls.Bottom.Color = RGB(35,70,128) ' Cor base
TChart1.Walls.Bottom.Transparent = True ' Se for um gráfico 3D, se a base é transparente TChart1.Walls.Back.Pen.Visible = True ' Parâmetro Se a borda das coordenadas é exibida
TChart1.Walls.Left.Size = 5 ' Se for um gráfico 3D, indica sua espessura ordenada
TChart1.Walls.Left.Color = 8454143 ' A cor da ordenada
TChart1.Walls.Left.Transparent = True ' Se for um gráfico 3D, se a parede ordenada é transparente
TChart1 .Legend.Visible = True ' Se a legenda deve ser exibida
TChart1.Legend.VertSpacing = 9 ' A altura do quadro da legenda
TChart1.Legend.DividingLines.Visible = False ' Se há linhas de espaçamento entre as legendas
'TChart1.Series(0 ) .Clear
'TChart1.Series(0).ColorEachPoint = True
'TChart1.Series(0).Add 180,"1 Quarter",RGB(35,70,128) ' Adiciona estaticamente dados de exibição ao gráfico, os parâmetros são valores numéricos em ordem, nome, cor'TChart1.Series
(0). Adicione 240, "2 Trimestre", 255
'TChart1.Series (0). Adicione 210, "3 Trimestre", & HFACE87
TChart1.Series (0). , "4 Quarter",16777215
TChart1.Axis.Depth.Visibl e= False ' Quando o eixo de coordenadas é 3D transparente, se a parede interna deve ser exibida
TChart1.Axis.DrawAxesBeforeSeries = False ' Se a grade é exibida na frente do gráfico
TChart1.Axis.Left.Title.Caption = "Valor de saída (unidade: 10.000 yuan)" ' Título do eixo vertical
TChart1.Axis.Left.Title.Font.Bold = True ' Título do eixo vertical se deve ser colocado em negrito
TChart1.Axis.Left. Title.Font.Size = 9 ' Tamanho do título do eixo vertical
TChart1.Axis.Left.Title.Visible = True ' Se deve exibir o nome do eixo vertical
TChart1.Axis.Left.Labels.Angle = 90 ' Ângulo de inclinação da fonte do eixo vertical
TChart1. Axis.Left.GridPen.Visible = True ' Se o eixo do parâmetro de abscissas exibe
TChart1.Axis.Bottom.Title.Caption = "Time Axis" ' Se o título do eixo de abscissas
TChart1.Axis.Bottom.Title.Font.Bold = True ' Se o título do eixo de abscissas está em negrito
TChart1.Axis .Bottom.Title.Font.Size= 9 'Tamanho do título do eixo de abscissas
TChart1.Axis.Bottom.Labels.Angle = 0 'Ângulo de inclinação da fonte de abscissas 0~360
TChart1.Axis.Bottom. GridPen.Visible = True ' Parâmetro vertical Se o eixo de coordenadas exibe
TChart1.Footer.Text.Add "Título inferior do gráfico" 'O título inferior do gráfico
TChart1.Footer.Font.Size = 11 'O tamanho da fonte do título inferior
TChart1 .Footer.Font.Bold = True 'Se a fonte do título inferior é Negrito
TChart1.Footer.Font.Italic = False 'Se a fonte do título inferior é itálico
TChart1.Export.SaveToJPEGFile server.mappath("MyChart.jpg") ,False,JPEGBestQuality, 100, TChart1.Width, TChart1.Height 'Exportar armazenamento
Definir TChart1 = nada
%>
para o arquivo MyChart.jpg <img src="MyChart.jpg"></BODY></HTML>
Nota: 1 Vale a pena estudar as propriedades do modo de exibição gráfica de TChart1.AddSeries(0). Os leitores interessados podem testá-lo de 0 a 39 para encontrar seu método de exibição ideal.
2. Para referências de cores, são utilizados três métodos de representação de RGB, por exemplo: RGB(255.255.255) = &HFFFFFF = 16777215. O método de conversão específico não é explicado.
3. As propriedades Verdadeiro e Falso podem ser representadas por 1 e 0.
Para adicionar gráficos de grupo, aqui está um exemplo de exibição de dois grupos de dados.
<%Set TChart1 = CreateObject("TeeChart.TChart")
TChart1.Header.Text(0)="Volume de vendas trimestral"'Título
TChart1.AddSeries(1)
TChart1.AddSeries(1)
TChart1.Series(0).Adicionar 180 , "Trimestre 1",RGB(255.255.255)
TChart1.Series(1).Adicione 240, "Trimestre 1",255
TChart1.Series(0).Adicione 280, "Trimestre 2",RGB(255.255.255)
TChart1.Series(1 ).Adicionar 200, "2º Trimestre",255
TChart1.Series(0).Adicionar 150, "3º Trimestre",RGB(255.255.255)
TChart1.Series(1).Adicionar 320, "3º Trimestre",255
TChart1.Series( 0).Add 360, "4 Quarters",RGB(255,255,255)
TChart1.Series(1).Add 200, "4 Quarters",255
TChart1.Series(0).Marks.Visible = True ' Se deve exibir o título dos dados
TChart1.Series(0).Marks.Style = 0 'Estilo de exibição de dados 0~9, 0 é valor numérico, 1 é porcentagem...
TChart1.Series(1).Marks.Style=0
TChart1.Export.SaveToJPEGFile server. mappath("MyChart .jpg"),False,JPEGBestQuality,100,TChart1.Width, TChart1.Height
Set TChart1 = nada
%>
Os dois exemplos acima geram resultados estatísticos estaticamente e depois os exibem. No entanto, no trabalho real, uma exibição de dados estatísticos mais dinâmica é lida no banco de dados existente. Abaixo damos um exemplo de uso do ADO para conectar-se diretamente ao banco de dados Access e exibir os resultados dinamicamente. O banco de dados é (test.mdb) e as duas colunas da tabela são colname e colvalue. Eles são o nome do mês e os dados estatísticos correspondentes colname (janeiro, fevereiro,...), colvalue (103, 210,...):
<%Dim OutputStream
Set TChart1 = CreateObject("TeeChart.TChart")
TChart1.Header Text(0)="Volume de vendas trimestral"'Title
TChart1.AddSeries(0)'O valor do estilo dos gráficos exibidos é 1~39, veja abaixo
Set Conn=Server.CreateObject("ADODB.Connection")
Set Rst= Server.CreateObject( "ADODB.Recordset")
Conn.Open "driver={driver de acesso microsoft (*.mdb)};dbq="&server.mappath("zcw.mdb")
strsql = "selecionar * do teste"
Rst. Abra strsql,conn,1,1
IF rst.RecordCount > 0 THEN
TChart1.Series(0).Datasource = rst
TChart1.Series(0).LabelsSource="colname"
TChart1.Series(0).YValues.ValueSource="colvalue "
ELSE
TChart1. Series(0).Fillsamplevalues(12)
TChart1.Header.Text(0)="Sem resultados, exibir dados aleatoriamente"
END IF
TChart1.Series(0).Marks.Visible=True
TChart1.Series(0) .Marks.Style =4
TChart1.Export.SaveToJPEGFile server.mappath("MyChart.jpg"),False,JPEGBestQuality,100,TChart1.Width, TChart1.Height
Set TChart1 = nada
Rst.Close
Set Conn = nada
%> <img src="MyChart .jpg">
Os três exemplos acima são todos exibidos após a geração de arquivos de imagem JPG estáticos. Se não houver valor em salvar os resultados da navegação, podemos usar PNG (Portable Network Graphics) para exibi-los.
<% Dim ChartType, OutputStream, ViewType
Set Chart1 = CreateObject("TeeChart.TChart")
Chart1.AddSeries(0)
Chart1.Series(0).FillSampleValues 20 ' Gera dados aleatoriamente
OutputStream=Chart1.Export.asPNG.SaveToStream
Set Chart1= Nothing
Response.Binarywrite OutputStream
%>
O texto acima é uma breve introdução à combinação dos atributos do componente TeeChart e da tecnologia ASP. Espero que seja útil para todos. Uma versão de avaliação gratuita do Teechart Pro ActiveX pode ser baixada em http://www.steema.com/download/Downloadindex.htm . Para exemplos de código de combinação de TeeChart com Asp, consulte http://www.steema.com/products/teechart/asp/ASPHome.htm .