Étant donné que la version TeeChart VCL est largement utilisée dans une variété d'environnements de développement et qu'elle est bien reconnue, la société espagnole Steema Software SL a développé TeeChart Pro ActiveX en octobre 1997. C'est sans aucun doute une bonne nouvelle pour le modèle de développement B/S puisqu'il ne doit être installé que côté serveur, le client n'a pas besoin d'installer d'autres logiciels. Les graphiques statistiques peuvent donc être affichés à l'aide d'un navigateur général. lancé, il a une fois de plus gagné en popularité.
Ensuite, nous présenterons les propriétés et applications communes des composants ActiveX TeeChart Pro V5 basés sur la technologie ASP.
Examinons d'abord un exemple de graphique à barres bidimensionnel utilisant le composant TeeChart pour afficher les « ventes trimestrielles » :
<HTML><BODY>
<%'-----------TeeChartEg.asp--- - --------------------
Set TChart1 = CreateObject("TeeChart.TChart")
TChart1.Header.Text(0)="Statistiques de ventes trimestrielles"
TChart1.AddSeries( 1)
TChart1.Aspect.View3D=0
TChart1.Series(0).Clear
TChart1.Series(0).Ajouter 180, "1 Quarter",RVB(35,70,128)
TChart1.Series(0).Ajouter 240, "2 Quarter",RGB(255,80,128)
TChart1.Series(0).Ajouter 210, "3 Quarter",&HFACE87
TChart1.Series(0).Ajouter 280, "4 Quarter",16777215
TChart1.Export.SaveToJPEGFile server.mappath( "MyChart.jpg"),False,JPEGBestQuality,100,TChart1.Width, TChart1.Height
Set TChart1 = rien
%>
<img src="MyChart.jpg">
</BODY></HTML>
1) Identique aux autres ASP composants La méthode d'utilisation est la même, créez d'abord l'objet.
Définir TChart1 = CreateObject("TeeChart.TChart")
2) Utilisez ses propriétés pour afficher un graphique statistique statique.
TChart1.Header.Text(0)="Statistiques de ventes trimestrielles"
...
TChart1.Series(0).Add 210, "3rd Quarter",&HFACE87
TChart1.Series(0).Add 280, "4th Quarter",16777215
3 ) Générer le fichier graphique statistique
TChart1.Export.SaveToJPEGFile server.mappath("MyChart.jpg"),False,JPEGBestQuality,100,TChart1.Width, TChart1.Height
4) Libérer l'objet
Définir TChart1 = rien
De nombreux attributs de la classe d'objet dans l'exemple ci-dessus Ce sont toutes des valeurs par défaut et nous pouvons ajouter des paramètres en fonction de circonstances spécifiques. Ce qui suit est une introduction détaillée aux autres propriétés courantes du composant TeeChart (répertoriées sous forme de commentaires du programme)
<HTML> <HEAD><TITLE>Introduction aux méthodes de propriétés de l'objet TeeChart</TITLE></HEAD>
< BODY>
<%
Set TChart1 = CreateObject("TeeChart.TChart")
TChart1.Height = 440 'La hauteur du graphique entier
TChart1.Width = 500 'La largeur du graphique entier'TChart1.Header.Text.Clear
'
TChart1. Header.Text.Add "Statistiques de ventes trimestrielles" 'Titre du graphique, la méthode peut également être sous la forme de TChart1.Header.Text(0)="title"
TChart1.Header.Font.Size = 22 'Taille de police du titre
TChart1. Header.Font.Bold = True 'Si la police du titre est
en grasTChart1 .Header.Font.Italic = True ' Si la police du titre est en italique
TChart1.Panel.MarginLeft = 3 ' La marge gauche du graphique
TChart1.Panel.Gradient.Visible = True ' S'il y a une couleur d'arrière-plan
TChart1.Panel.Gradient.StartColor = &HB3DEF ' Couleur du bas du graphique Couleur de début
TChart1.Panel.Gradient.EndColor = &HFACE87 ' Couleur d'arrière-plan du graphique Couleur de fin
TChart1.Panel.BevelWidth = 0 ' Largeur d'indentation du canevas
TChart1.AddSeries(0) ' La façon d'afficher les graphiques, la plage de valeurs est de 1 ~ 39
TChart1.Aspect.View3D = False ' False représente les graphiques 2D, True représente les graphiques 3D
TChart1.Aspect.Chart3DPercent = 10 ' Si c'est le cas est un graphique 3D, il représente son inclinaison
TChart1.Aspect.Zoom = 100 ' Taux d'affichage graphique
TChart1.Aspect.Orthogonal = TRUE 'Si le graphique 3D est pivoté latéralement
TChart1.Aspect.Rotation = -20 'Si le graphique est pivoté latéralement , l'angle de rotation horizontale est de -360~360
TChart1.Aspect.Elevation = 0 ' Si le graphique est pivoté latéralement, faites pivoter l'avant et l'arrière. Angle -360~360
TChart1.Aspect.Perspective = 0 ' Degré d'agrégation centripète des graphiques 3D
TChart1.Aspect .Chart3DPercent = 20 ' Épaisseur du graphique 3D 1~100
TChart1.Walls.Bottom.Size = 5 ' S'il s'agit d'un graphique 3D, il indique son épaisseur en abscisse
TChart1.Walls.Bottom.Color = RGB(35,70,128) ' Couleur de base
TChart1.Walls.Bottom.Transparent = True ' S'il s'agit d'un graphique 3D, si la base est transparente TChart1.Walls.Back.Pen.Visible = True ' Paramètre Indique si la bordure des coordonnées est affichée
TChart1.Walls.Left.Size = 5 ' S'il s'agit d'un graphique 3D, il indique son épaisseur ordonnée
TChart1.Walls.Left.Color = 8454143 ' La couleur ordonnée
TChart1.Walls.Left.Transparent = True ' S'il s'agit d'un graphique 3D, si le mur ordonné est transparent
TChart1 .Legend.Visible = True ' S'il faut afficher la légende
TChart1.Legend.VertSpacing = 9 ' La hauteur du cadre de légende
TChart1.Legend.DividingLines.Visible = False ' S'il y a des lignes d'espacement entre les légendes
'TChart1.Series(0 ) .Clear
'TChart1.Series(0).ColorEachPoint = True
'TChart1.Series(0).Add 180,"1 Quarter",RGB(35,70,128) ' Ajoutez statiquement des données d'affichage au graphique, les paramètres sont des valeurs numériques dans l'ordre, nom, couleur'TChart1.Series
(0).Ajoutez 240, "2 Quarter",255
'TChart1.Series(0).Ajoutez 210, "3 Quarter",&HFACE87
TChart1.Series(0).Ajoutez 280 , "4 Quarter",16777215
TChart1.Axis.Depth.Visibl e= False ' Lorsque l'axe de coordonnées est transparent en 3D, afficher ou non la paroi intérieure
TChart1.Axis.DrawAxesBeforeSeries = False ' Indique si la grille est affichée devant le graphique
TChart1.Axis.Left.Title.Caption = "Valeur de sortie (unité : 10 000 yuans)" ' Titre de l'axe vertical
TChart1.Axis.Left.Title.Font.Bold = True ' Titre de l'axe vertical s'il faut mettre en gras
TChart1.Axis.Left. Title.Font.Size = 9 ' Taille du titre de l'axe vertical
TChart1.Axis.Left.Title.Visible = True ' S'il faut afficher le nom de l'axe vertical
TChart1.Axis.Left.Labels.Angle = 90 ' Angle d'inclinaison de la police de l'axe vertical
TChart1. Axis.Left.GridPen.Visible = True ' Si l'axe du paramètre des abscisses affiche
TChart1.Axis.Bottom.Title.Caption = "Time Axis" ' Si le titre de l'axe des abscisses
TChart1.Axis.Bottom.Title.Font.Bold = True ' Indique si le titre de l'axe des abscisses est en gras
TChart1.Axis .Bottom.Title.Font.Size= 9 'Taille du titre de l'axe des abscisses
TChart1.Axis.Bottom.Labels.Angle = 0 'Angle d'inclinaison de la police des abscisses 0~360
TChart1.Axis.Bottom. GridPen.Visible = True ' Paramètre vertical Indique si l'axe de coordonnées affiche
TChart1.Footer.Text.Add "Titre inférieur du graphique" 'Le titre inférieur du graphique
TChart1.Footer.Font.Size = 11 'La taille de la police du titre inférieur
TChart1 .Footer.Font.Bold = True 'Si la police du titre inférieur est en gras
TChart1.Footer.Font.Italic = False 'Si la police du titre inférieur est en italique
TChart1.Export.SaveToJPEGFile server.mappath("MyChart.jpg") ,False,JPEGBestQuality, 100, TChart1.Width, TChart1.Height 'Export storage
Set TChart1 = rien
%>
pour le fichier MyChart.jpg <img src="MyChart.jpg"></BODY></HTML>
Remarque : 1 .Les propriétés du mode d'affichage graphique de TChart1.AddSeries(0) méritent d'être étudiées. Les lecteurs intéressés peuvent le tester de 0 à 39 pour trouver leur méthode d'affichage idéale.
2. Pour les références de couleurs, trois méthodes de représentation de RVB sont utilisées, par exemple : RVB(255,255,255) = &HFFFFFF = 16777215. La méthode de conversion spécifique n'est pas expliquée.
3. Les propriétés True et False peuvent être représentées par 1 et 0 à la place.
Pour l'ajout de graphiques de groupe, voici un exemple d'affichage de deux groupes de données.
<%Set TChart1 = CreateObject("TeeChart.TChart")
TChart1.Header.Text(0)="Volume des ventes trimestrielles"'Titre
TChart1.AddSeries(1)
TChart1.AddSeries(1)
TChart1.Series(0).Add 180 , "Quartier 1",RVB(255,255,255
)TChart1.Series(1).Ajouter 240, "Quartier 1",255
TChart1.Series(0).Ajouter 280, "Quartier 2",RVB(255,255,255)
TChart1.Series(1 ).Ajoutez 200, "2ème trimestre",255
TChart1.Series(0).Ajoutez 150, "3ème trimestre",RVB(255,255,255)
TChart1.Series(1).Ajoutez 320, "3ème 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 ' S'il faut afficher le titre des données
TChart1. Series(0).Marks.Style = 0 'Style d'affichage des données 0~9, 0 est une valeur numérique, 1 est un pourcentage...
TChart1.Series(1).Marks.Style=0
Serveur TChart1.Export.SaveToJPEGFile. mappath("MyChart .jpg"),False,JPEGBestQuality,100,TChart1.Width, TChart1.Height
Set TChart1 = Nothing
%>
Les deux exemples ci-dessus génèrent statiquement des résultats statistiques, puis les affichent. Cependant, dans le travail réel, un affichage de données statistiques plus dynamique est lu à partir de la base de données existante. Ci-dessous, nous donnons un exemple d'utilisation d'ADO pour se connecter directement à la base de données Access et afficher dynamiquement les résultats. La base de données est (test.mdb) et les deux colonnes de la table sont colname et colvalue. Il s'agit du nom du mois et des données statistiques correspondantes (janvier, février,...), colvalue (103, 210,...) :
<%Dim OutputStream
Set TChart1 = CreateObject("TeeChart.TChart")
TChart1.Header . Text(0)="Volume des ventes trimestrielles"'Title
TChart1.AddSeries(0)'La valeur de style des graphiques affichés est comprise entre 1 et 39, voir ci-dessous
Set Conn=Server.CreateObject("ADODB.Connection")
Set Rst=. Server.CreateObject( "ADODB.Recordset")
Conn.Open "driver={microsoft access driver (*.mdb)};dbq="&server.mappath("zcw.mdb")
strsql = "select * from test"
Rst. Ouvrez strsql,conn ,1,1
SI rst.RecordCount > 0 ALORS
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)="Aucun résultat, affichage aléatoire des données"
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 = rien
Rst.Close
Set Conn = rien
%> <img src="MyChart .jpg">
Les trois exemples ci-dessus sont tous affichés après avoir généré des fichiers image JPG statiques. S'il n'y a aucune valeur à enregistrer les résultats de navigation, nous pouvons utiliser PNG (Portable Network Graphics) pour les afficher.
<% Dim ChartType, OutputStream, ViewType
Set Chart1 = CreateObject("TeeChart.TChart")
Chart1.AddSeries(0)
Chart1.Series(0).FillSampleValues 20 ' Générer des données de manière aléatoire
OutputStream=Chart1.Export.asPNG.SaveToStream
Set Chart1= Nothing
Response.Binarywrite OutputStream
%>
Ce qui précède est une brève introduction à la combinaison des attributs du composant TeeChart et de la technologie ASP. J'espère que cela sera utile à tout le monde. Une version d'essai gratuite de Teechart Pro ActiveX peut être téléchargée à partir de http://www.steema.com/download/Downloadindex.htm . Pour des exemples de code combinant TeeChart avec Asp, veuillez vous référer à http://www.steema.com/products/teechart/asp/ASPHome.htm .