تخصيص محاور المخططات في العروض التقديمية باستخدام JavaScript

نظرة عامة

يشرح هذا المقال كيفية تخصيص محاور المخطط باستخدام Aspose.Slides for Node.js عبر Java. يغطي القيم المحسوبة للمحور، تبديل صفوف وأعمدة المخطط، إظهار المحور، فواصل تسميات الفئات وعلامات التحديد، فئات التاريخ وتنسيقها، تدوير العنوان، موضع المحور، ووحدات العرض.

الحصول على القيم القصوى على المحور العمودي في المخططات

أنشئ العرض وأضف مخطط مساحة ببيانات افتراضية. استدعِ validateChartLayout قبل قراءة قيم المحور المحسوبة لضمان تحديث تخطيط المخطط.

اقرأ getActualMaxValue و getActualMinValue لحدود المحور، وgetActualMajorUnit وgetActualMinorUnit لفواصل العلامات. يوفر getActualMajorUnitScale وgetActualMinorUnitScale مقاييس الزمن للوحدات، وهو ما يهم محاور التاريخ. يُخزن المثال هذه القيم في متغيرات محلية ثم يحفظ المخطط.

var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");

var presentation = new aspose.slides.Presentation();
try {
    var slide = presentation.getSlides().get_Item(0);

    var chart = slide.getShapes().addChart(aspose.slides.ChartType.Area, 100, 100, 500, 350);
    chart.validateChartLayout();

    var maxValue = chart.getAxes().getVerticalAxis().getActualMaxValue();
    var minValue = chart.getAxes().getVerticalAxis().getActualMinValue();

    var majorUnit = chart.getAxes().getVerticalAxis().getActualMajorUnit();
    var minorUnit = chart.getAxes().getVerticalAxis().getActualMinorUnit();

    var majorUnitScale = chart.getAxes().getVerticalAxis().getActualMajorUnitScale();
    var minorUnitScale = chart.getAxes().getVerticalAxis().getActualMinorUnitScale();

    presentation.save("AxisValues_out.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    presentation.dispose();
}

تبديل البيانات بين المحاور

استخدم switchRowColumn لتبادل أدوار السلاسل والفئات في بيانات المخطط. كل فئة سابقة تصبح سلسلة، وكل سلسلة سابقة تصبح فئة. هذا يغيّر طريقة تجميع البيانات؛ ولا يبدّل المحاور الأفقية والعمودية. يستخدم المثال setRange لربط البيانات الافتراضية بـ Sheet1!A1:D5، بما في ذلك صف الرأس وعمود الفئة، قبل تبديل الصفوف والأعمدة. ثم يحفظ مخططًا بأربع سلاسل وثلاث فئات.

var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");

var presentation = new aspose.slides.Presentation();
try {
    var slide = presentation.getSlides().get_Item(0);

    var chart = slide.getShapes().addChart(aspose.slides.ChartType.ClusteredColumn, 100, 100, 400, 300);
    chart.getChartData().setRange("Sheet1!A1:D5");
    chart.getChartData().switchRowColumn();

    presentation.save("SwitchChartRowColumns_out.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    presentation.dispose();
}

إلغاء إظهار المحور العمودي للمخططات الخطية

استدعِ setVisible مع false على المحور العمودي لإخفائه. ينشئ المثال مخططًا خطيًا ببيانات افتراضية ويحفظه مع إخفاء المحور العمودي.

var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");

var presentation = new aspose.slides.Presentation();
try {
    var slide = presentation.getSlides().get_Item(0);

    var chart = slide.getShapes().addChart(aspose.slides.ChartType.Line, 100, 100, 400, 300);
    chart.getAxes().getVerticalAxis().setVisible(false);

    presentation.save("HiddenVerticalAxis.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    presentation.dispose();
}

إلغاء إظهار المحور الأفقي للمخططات الخطية

استدعِ setVisible مع false على المحور الأفقي لإخفائه. ينشئ المثال مخططًا خطيًا ببيانات افتراضية ويحفظه مع إخفاء المحور الأفقي.

var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");

var presentation = new aspose.slides.Presentation();
try {
    var slide = presentation.getSlides().get_Item(0);

    var chart = slide.getShapes().addChart(aspose.slides.ChartType.Line, 100, 100, 400, 300);
    chart.getAxes().getHorizontalAxis().setVisible(false);

    presentation.save("HiddenHorizontalAxis.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    presentation.dispose();
}

تغيير محور الفئة

استخدم setCategoryAxisType لاختيار محور فئة تاريخ أو نص. يتطلب هذا المثال ملف ExistingChart.pptx، حيث يكون المخطط هو الشكل الأول في الشريحة الأولى وتحتوي خلايا الفئات على قيم تاريخ Excel رقمية. يغيّر المحور الأفقي إلى محور تاريخ. يستدعي setAutomaticMajorUnit مع false، ثم setMajorUnit مع 1، وsetMajorUnitScale مع TimeUnitType.Months لتعيين العلامات الرئيسية بفواصل شهرية.

var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");

var presentation = new aspose.slides.Presentation("ExistingChart.pptx");
try {
    var slide = presentation.getSlides().get_Item(0);

    var chart = slide.getShapes().get_Item(0);
    chart.getAxes().getHorizontalAxis().setCategoryAxisType(aspose.slides.CategoryAxisType.Date);
    chart.getAxes().getHorizontalAxis().setAutomaticMajorUnit(false);
    chart.getAxes().getHorizontalAxis().setMajorUnit(1);
    chart.getAxes().getHorizontalAxis().setMajorUnitScale(aspose.slides.TimeUnitType.Months);

    presentation.save("ChangeChartCategoryAxis_out.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    presentation.dispose();
}

التحكم في فواصل تسميات محور الفئة

عند وجود عدد كبير من الفئات في المخطط، قلل عدد تسميات المحور الظاهرة دون حذف الفئات أو نقاط البيانات. استدعِ setAutomaticTickLabelSpacing مع false، ثم مرّر الفاصل المطلوب إلى setTickLabelSpacing. بالنسبة للفئات النصية بترتيبها الطبيعي، يبدأ العد من الفئة الأولى:

الفاصل التسميات المعروضة في المثال
1 الفئة 1، الفئة 2، الفئة 3، … الفئة 24
2 الفئة 1، الفئة 3، الفئة 5، … الفئة 23
3 الفئة 1، الفئة 4، الفئة 7، … الفئة 22

فاصل 3 يعرض كل تسمية ثالثة، ويترك علامتين مخفيتين بين كل تسمية ظاهرة. لا يزيل الأعمدة المقابلة. يختار الفاصل التلقائي بناءً على المساحة المتاحة؛ ولا يعني بالضرورة عرض كل تسمية.

لعلامات التحديد هناك ضوابط منفصلة. استدعِ setAutomaticTickMarksSpacing مع false واستخدم setTickMarksSpacing لتعيين فاصلها. على سبيل المثال، 1 يحافظ على علامة تحديد في كل فاصل فئة بينما تظهر التسميات كل فئة ثالثة فقط. استخدم setMajorTickMark بأسلوب مرئي لتتمكن من رؤية النتيجة. إعادة استدعاء أي من محددات الفاصل التلقائي مع true تسمح للمخطط باختيار الفاصل مرة أخرى.

المثال التالي المستقل يخلق 24 فئة وسلسلة واحدة، ثم يحفظ ثلاث شرائح في CategoryAxisIntervals.pptx: الفاصل التلقائي، الفاصل اليدوي للتسميات مع علامات تحديد مستقلة، واستعادة الفاصل التلقائي. النسختان تحتفظان ببيانات المخطط الأصلية. لا يلزم عرض تقديمي إدخالي. يجعل النص الأفقي للتسمية الفرق في الكثافة واضحًا.

var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");

var presentation = new aspose.slides.Presentation();
try {
    var slide = presentation.getSlides().get_Item(0);

    var chart = slide.getShapes().addChart(aspose.slides.ChartType.ClusteredColumn, 30, 40, 660, 320);

    chart.setLegend(false);
    chart.getChartData().getCategories().clear();
    chart.getChartData().getSeries().clear();

    var workbook = chart.getChartData().getChartDataWorkbook();
    workbook.clear(0);

    var series = chart.getChartData().getSeries().add(aspose.slides.ChartType.ClusteredColumn);
    for (var i = 0; i < 24; i++) {
        var categoryCell = workbook.getCell(0, i + 1, 0, "Category " + (i + 1));
        chart.getChartData().getCategories().add(categoryCell);
        var valueCell = workbook.getCell(0, i + 1, 1, 10 + i % 6 * 5);
        series.getDataPoints().addDataPointForBarSeries(valueCell);
    }

    var axis = chart.getAxes().getHorizontalAxis();
    axis.setCategoryAxisType(aspose.slides.CategoryAxisType.Text);
    axis.getTextFormat().getTextBlockFormat().setRotationAngle(0);
    axis.getTextFormat().getPortionFormat().setFontHeight(12);
    axis.setMajorTickMark(aspose.slides.TickMarkType.Outside);
    axis.setAutomaticTickLabelSpacing(true);
    axis.setAutomaticTickMarksSpacing(true);

    // الشريحة 2: اعرض كل تسمية ثالثة، ولكن احتفظ بعلامة تحديد لكل فئة.
    var manualSlide = presentation.getSlides().addClone(slide);
    var manualChart = manualSlide.getShapes().get_Item(0);
    var manualAxis = manualChart.getAxes().getHorizontalAxis();
    manualAxis.setAutomaticTickLabelSpacing(false);
    manualAxis.setTickLabelSpacing(3);
    manualAxis.setAutomaticTickMarksSpacing(false);
    manualAxis.setTickMarksSpacing(1);

    // الشريحة 3: دع المخطط يختار كلا الفاصلين مرة أخرى.
    var restoredSlide = presentation.getSlides().addClone(manualSlide);
    var restoredChart = restoredSlide.getShapes().get_Item(0);
    restoredChart.getAxes().getHorizontalAxis().setAutomaticTickLabelSpacing(true);
    restoredChart.getAxes().getHorizontalAxis().setAutomaticTickMarksSpacing(true);

    presentation.save("CategoryAxisIntervals.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    presentation.dispose();
}

الفاصل التلقائي (الشريحة 1): في هذا العرض، تُعرض كل تسمية فئة ثانية وتلتف إلى سطرين. قد يختلف الناتج التلقائي حسب حجم المخطط، الخطوط، وأداة العرض.

تباعد تلقائي لتسمية الفئات مع إظهار جميع الأعمدة الـ 24

الفاصل اليدوي (الشريحة 2): تُعرض كل تسمية ثالثة على سطر واحد، بينما تبقى علامات التحديد في كل فاصل فئة. جميع الأعمدة الـ 24، بما فيها التي لا تحمل تسميات، تظل مرئية بنفس القيم. تستعيد الشريحة 3 المظهر التلقائي المعروض أعلاه.

فاصل يدوي لتسمية الفئات بمقدار ثلاثة مع إظهار جميع الأعمدة الـ 24

اختر المحور والفاصل الصحيح

استخدم هذا الفاصل عدد الفئات لمحور فئة نصية، مثل محور الفئة في مخطط عمودي، خطي، مساحة أو شريطي. في المخطط العمودي يكون هو المحور الأفقي. في المخطط الشريطي الأفقي يكون محور الفئة عموديًا، لذا طبّق هذه الإعدادات على المحور الذي تُعيده getVerticalAxis. يطبق فاصل علامة التحديد أيضًا على محور السلاسل في المخططات التي تحتوي على واحد.

لا تستخدم فاصل تسميات الفئة لتحديد مقياس رقمي لمحور القيمة. على محور القيمة، يحدد setMajorUnit الفرق في القيم: على سبيل المثال، وحدة رئيسية 10 تنتج علامات عند 0، 10، 20، وهكذا عندما يبدأ المحور من الصفر. فاصل تسمية الفئة 3 يعد مواقع الفئات بغض النظر عن قيم البيانات. تستخدم مخططات التشتت والفقاعات محاور قيمة بدلاً من محور فئة نصية. بالنسبة لمحور التاريخ، استخدم الوحدات الرئيسية القائمة على الوقت والمقاييس كما هو موضح في تغيير محور الفئة.

تعيين تنسيق التاريخ لقيم محور الفئة

يستبدل المثال بيانات المخطط الافتراضية بأربع قيم سنوية. تُخزن التواريخ كأرقام تسلسلية OLE Automation في ورقة العمل الأولى (الفهرس 0)، محسوبة كعدد الأيام منذ 30 ديسمبر 1899. يستخدم حساب JavaScript طوابع زمنية UTC ويقسم الفرق على 86 400 000 ملي ثانية لكل يوم. استخدم setCategoryAxisType مع CategoryAxisType.Date، واستدعِ setNumberFormatLinkedToSource مع false، ومرّر yyyy إلى setNumberFormat لتظهر تسميات الفئات سنوات رباعية الأرقام بشكل مستقل عن تنسيق الخلية.

var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");

var presentation = new aspose.slides.Presentation();
try {
    var slide = presentation.getSlides().get_Item(0);

    var chart = slide.getShapes().addChart(aspose.slides.ChartType.Line, 50, 50, 450, 300);

    chart.getChartData().getCategories().clear();
    chart.getChartData().getSeries().clear();

    var workbook = chart.getChartData().getChartDataWorkbook();
    workbook.clear(0);

    var baseDate = Date.UTC(1899, 11, 30);

    var series = chart.getChartData().getSeries().add(aspose.slides.ChartType.Line);
    for (var i = 0; i < 4; i++) {
        var date = Date.UTC(2015 + i, 0, 1);
        var categoryCell = workbook.getCell(0, i + 1, 0, (date - baseDate) / 86400000);
        chart.getChartData().getCategories().add(categoryCell);

        var valueCell = workbook.getCell(0, i + 1, 1, i + 1);
        series.getDataPoints().addDataPointForLineSeries(valueCell);
    }

    chart.getAxes().getHorizontalAxis().setCategoryAxisType(aspose.slides.CategoryAxisType.Date);
    chart.getAxes().getHorizontalAxis().setNumberFormatLinkedToSource(false);
    chart.getAxes().getHorizontalAxis().setNumberFormat("yyyy");

    presentation.save("DateAxisFormat.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    presentation.dispose();
}

ضبط زاوية الدوران لعنوان محور المخطط

استدعِ setTitle مع true على المحور العمودي، قدّم نص العنوان، واستخدم setRotationAngle لتدوير العنوان. تُقاس الزاوية بالدرجات؛ يحفظ هذا المثال مخططًا عموديًا مع تدوير عنوان محور القيمة بزاوية 90 درجة.

var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");

var presentation = new aspose.slides.Presentation();
try {
    var slide = presentation.getSlides().get_Item(0);

    var chart = slide.getShapes().addChart(aspose.slides.ChartType.ClusteredColumn, 50, 50, 450, 300);
    chart.getAxes().getVerticalAxis().setTitle(true);
    chart.getAxes().getVerticalAxis().getTitle().addTextFrameForOverriding("Value");
    chart.getAxes().getVerticalAxis().getTitle().getTextFormat().getTextBlockFormat().setRotationAngle(90);

    presentation.save("RotatedAxisTitle.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    presentation.dispose();
}

ضبط موضع المحور على محور الفئة أو القيمة

استخدم setAxisBetweenCategories للتحكم فيما إذا كان محور القيمة يعبر محور الفئة بين الفئات أو عند علامات الفئة. ينطبق هذا الإعداد على محاور الفئات. يضبط المثال القيمة إلى true على محور الفئة الأفقي في مخطط عمودي ويحفظ النتيجة.

var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");

var presentation = new aspose.slides.Presentation();
try {
    var slide = presentation.getSlides().get_Item(0);

    var chart = slide.getShapes().addChart(aspose.slides.ChartType.ClusteredColumn, 50, 50, 450, 300);
    chart.getAxes().getHorizontalAxis().setAxisBetweenCategories(true);

    presentation.save("AxisBetweenCategories.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    presentation.dispose();
}

ضبط وحدة العرض على محور قيمة المخطط

استخدم setDisplayUnit لتقليص تسميات محور القيمة دون تغيير البيانات الأساسية. مع DisplayUnitType مضبوطًا على Millions، تُعرض القيمة 60 000 000 كـ 60. يُنشئ المثال مخططًا عموديًا ويطبق وحدة العرض بالملايين على محوره العمودي.

var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");

var presentation = new aspose.slides.Presentation();
try {
    var slide = presentation.getSlides().get_Item(0);

    var chart = slide.getShapes().addChart(aspose.slides.ChartType.ClusteredColumn, 50, 50, 450, 300);
    chart.getAxes().getVerticalAxis().setDisplayUnit(aspose.slides.DisplayUnitType.Millions);

    presentation.save("Result.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    presentation.dispose();
}

الأسئلة المتكررة

كيف يمكنني تعيين القيمة التي يتقاطع عندها محور مع الآخر (تقاطع المحاور)؟

استخدم setCrossType لتحديد سلوك التقاطع. لتحديد قيمة تقاطع رقمية، استخدم setCrossAt. تسمح لك هذه الإعدادات بنقل تقاطع المحور إلى خط أساس مناسب.

كيف يمكنني موضع تسميات العلامات نسبة إلى المحور؟

استدعِ setTickLabelPosition باستخدام TickLabelPositionType: Low، High، NextTo أو None. للتحكم في علامات التحديد نفسها، استخدم setMajorTickMark أو setMinorTickMark; هذه مستقلة عن موضع التسميات.