غالبًا ما نرى بعض الصور التي تم تحديثها ديناميكيًا على صفحات الويب، وأكثرها شيوعًا هو مخطط K-line للأسهم. تحاول هذه المقالة استخدام مثال بسيط لتوضيح كيفية استدعاء JavaBean من خلال JSP لإنشاء رسم بياني ديناميكي على صفحة الويب. .
الخلفية: عندما كنت أقوم بتطوير مشروع لمكتب الإحصاء مؤخرًا، كنت منخرطًا في مشكلة إنشاء الصور ديناميكيًا على صفحة الويب، وقد استغرق الأمر يومًا واحدًا وقمت بحلها أخيرًا لمساعدة الجميع على تجنب الانعطافات عند مواجهة نفس المشكلة في المستقبل، سأقوم الآن بنشر أفكار التصميم وكود المصدر ليشاركها الجميع. تم اختبار التعليمة البرمجية التالية بنجاح على نظام التشغيل Windows 2000، ويستخدم خادم تطبيقات الويب Allaire's Jrun3.0.
الخطوة 1: إنشاء Java Bean لإنشاء ملفات jpg.
البرنامج المصدر هو كما يلي:
//Java Bean لإنشاء الصور
// المؤلف: كوي جوانيو
//التاريخ:2001-08-24
استيراد java.io.*;
import java.util.*;
import com.sun.image.codec.jpeg.*;
import java.awt.image.*;
import java.awt.*;
public class ChartGraphics {
صورة مخزنة.
إنشاء صورة باطلة عامة (سلسلة ملف الموقع) {
يحاول {
FileOutputStream fos = new FileOutputStream(fileLocation);
BufferedOutputStream bos = new BufferedOutputStream(fos);
JPEGImageEncoder encoder = JPEGCodec.createJPEGEncoder(bos);
encoder.encode(image);
bos.Close();
} قبض (استثناء ه) {
System.out.println(e);
}
}
public void graphicsGeneration(int h1,int h2,int h3,int h4,int h5) {
Final int X=10;
=
300; // ارتفاع الصورة int columnWidth=30; // عرض العمود int columnHeight=200;
ChartGraphics = new ChartGraphics();
ChartGraphics.image = new BufferedImage(imageWidth, imageHeight, BufferedImage.TYPE_INT_RGB);
الرسومات الرسومية = ChartGraphics.image.getGraphics();
graphics.setColor(Color.white);
graphics.fillRect(0,0,imageWidth,imageHeight);
graphics.setColor(Color.red);
graphics.drawRect(X+1*columnWidth, columnHeight-h1, columnWidth, h1);
graphics.drawRect(X+2*columnWidth, columnHeight-h2, columnWidth, h2);
graphics.drawRect(X+3*columnWidth, columnHeight-h3, columnWidth, h3);
graphics.drawRect(X+4*columnWidth, columnHeight-h4, columnWidth, h4);
graphics.drawRect(X+5*columnWidth, columnHeight-h5, columnWidth, h5);
ChartGraphics.createImage("D:\temp\chart.jpg");
}
}
Explanation: يتم استخدام طريقة createImage(String fileLocation) لإنشاء صورة JPG. المعلمة fileLocation هي مسار الملف.
يتم استخدام طريقة graphicsGeneration(int h1, int h2, int h3, int h4, int h5) لرسم المحتوى. المعلمات h1...h5 الخطوة 2 لارتفاع كل مستطيل
: قم بإنشاء Java Bean آخر لقراءة البيانات من الملف النصي (ارتفاع كل مستطيل). في التطبيقات الفعلية، يتم تخزين البيانات في Oracle قاعدة بيانات
البرنامج المصدر كما يلي:
// قراءة ملف نصي Java Bean للبيانات
// المؤلف: كوي جوانيو
//التاريخ:2001-08-24
استيراد java.io.*;
الطبقة العامة GetData {
int heightArray[] = new int[5];
كثافة العمليات العامة[] getHightArray() {
يحاول {
RandomAccessFile RandomAccessFile = new RandomAccessFile ("d:\temp\ColumnHeightArray.txt"،"r")؛
ل(int i=0;i<5;i++)
{
heightArray[i] = Integer.parseInt(randomAccessFile.readLine());
}
}
قبض (استثناء ه) {
System.out.println(e);
}
إرجاع الارتفاعArray؛
}
}
Explanation: يتم استخدام getHightArray() لقراءة البيانات من النص، وتحويل نوع السلسلة في النص إلى نوع int، وإعادته كنوع مصفوفة.
الخطوة 3: قم بإنشاء برنامج مصدر ملف JSP
كما يلي:
＜%@ page import="ChartGraphics" %＞
＜%@ استيراد الصفحة = "GetData" %＞
＜jsp:useBean id="cg" class="ChartGraphics"/＞
＜jsp:useBean id="gd" class="GetData"/＞
<%!
int height[]=new int[5];
%>
<%
height=gd.getHightArray();
cg.graphicsGeneration(height[0],height[1],height[2],height[3],height[4]);
%>
<أتش تي أم أل>
<الجسم>
＜img src="d:tempchart.jpg"＞＜/img＞
＜/ الجسم＞
</html>
Explanation: يستدعي JSP أولاً Bean (GetData..class) لقراءة البيانات الموجودة في الملف، ثم يستدعي Bean (ChartGraphics.class) لإنشاء الصورة، وفي النهاية يعرض الصورة.
الخلاصة: بما أن البيانات الموجودة في النص (ColumnHeightArray.txt) يمكن أن تتغير في أي وقت، فإن ارتفاع المستطيلات الخمسة في الصورة التي تم إنشاؤها يتغير وفقًا لذلك، وبالتالي تحقيق التوليد الديناميكي للصورة، ويمكن أيضًا استخدام فكرة التصميم هذه نظام التصويت على المواقع.