Buat atau Perbarui Diagram Presentasi PowerPoint dalam JavaScript
Gambaran Umum
Artikel ini memberikan panduan komprehensif tentang cara membuat dan menyesuaikan diagram menggunakan Aspose.Slides. Anda akan belajar cara secara programatik menambahkan diagram ke slide, mengisinya dengan data, dan menerapkan berbagai opsi format untuk memenuhi kebutuhan desain spesifik Anda. Sepanjang artikel, contoh kode terperinci menggambarkan setiap langkah, mulai dari menginisialisasi presentasi dan objek diagram hingga mengkonfigurasi seri, sumbu, dan legenda. Dengan mengikuti panduan ini, Anda akan memperoleh pemahaman yang kuat tentang cara mengintegrasikan pembuatan diagram dinamis ke dalam aplikasi Anda, mempermudah proses pembuatan presentasi berbasis data.
Buat Diagram
Diagram membantu orang dengan cepat memvisualisasikan data dan memperoleh wawasan yang mungkin tidak langsung terlihat dari tabel atau spreadsheet.
Mengapa Membuat Diagram?
Dengan diagram, Anda dapat:
- menggabungkan, memadatkan, atau merangkum sejumlah besar data pada satu slide dalam sebuah presentasi
- menampilkan pola dan tren dalam data
- menyimpulkan arah dan momentum data seiring waktu atau terhadap satuan pengukuran tertentu
- mengidentifikasi outlier, penyimpangan, deviasi, kesalahan, data yang tidak masuk akal, dll.
- mengkomunikasikan atau menyajikan data yang kompleks
Di PowerPoint, Anda dapat membuat diagram melalui fungsi Insert, yang menyediakan templat untuk merancang berbagai jenis diagram. Dengan Aspose.Slides, Anda dapat membuat diagram reguler (berdasarkan tipe diagram populer) dan diagram kustom.
Note
Untuk membuat diagram, gunakan kelas ChartType . Bidang‑bidang dalam kelas ini sesuai dengan berbagai tipe diagram.Buat Diagram Kolom Berkumpul
Bagian ini menjelaskan cara membuat diagram kolom berkumpul menggunakan Aspose.Slides. Anda akan belajar menginisialisasi presentasi, menambahkan diagram, dan menyesuaikan elemen‑elemen seperti judul, data, seri, kategori, dan gaya. Ikuti langkah‑langkah di bawah ini untuk melihat bagaimana diagram kolom berkumpul standar dihasilkan:
- Buat sebuah instance dari kelas Presentation .
- Dapatkan referensi ke slide menggunakan indeksnya.
- Tambahkan diagram dengan beberapa data dan tentukan tipe
ChartType.ClusteredColumn. - Tambahkan judul ke diagram.
- Akses worksheet data diagram.
- Hapus semua seri dan kategori default.
- Tambahkan seri dan kategori baru.
- Tambahkan data diagram baru untuk seri diagram.
- Terapkan warna isi ke seri diagram.
- Tambahkan label ke seri diagram.
- Simpan presentasi yang telah dimodifikasi sebagai file PPTX.
Kode C# ini menunjukkan cara membuat diagram kolom berkumpul:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
const java = require("java");
// Membuat instance kelas presentasi yang mewakili file PPTX
var pres = new aspose.slides.Presentation();
try {
// Mengakses slide pertama
var sld = pres.getSlides().get_Item(0);
// Menambahkan diagram dengan data default-nya
var chart = sld.getShapes().addChart(aspose.slides.ChartType.ClusteredColumn, 0, 0, 500, 500);
// Mengatur Judul diagram
chart.setTitle(true);
chart.getChartTitle().addTextFrameForOverriding("Sample Title");
chart.getChartTitle().getTextFrameForOverriding().getTextFrameFormat().setCenterText(java.newByte(aspose.slides.NullableBool.True));
chart.getChartTitle().setHeight(20);
// Mengatur seri pertama agar menampilkan nilai
chart.getChartData().getSeries().get_Item(0).getLabels().getDefaultDataLabelFormat().setShowValue(true);
// Mengatur indeks untuk lembar data diagram
var defaultWorksheetIndex = 0;
// Mendapatkan WorkSheet data diagram
var fact = chart.getChartData().getChartDataWorkbook();
// Menghapus seri dan kategori yang dihasilkan secara default
chart.getChartData().getSeries().clear();
chart.getChartData().getCategories().clear();
var s = chart.getChartData().getSeries().size();
s = chart.getChartData().getCategories().size();
// Menambahkan seri baru
chart.getChartData().getSeries().add(fact.getCell(defaultWorksheetIndex, 0, 1, "Series 1"), chart.getType());
chart.getChartData().getSeries().add(fact.getCell(defaultWorksheetIndex, 0, 2, "Series 2"), chart.getType());
// Menambahkan kategori baru
chart.getChartData().getCategories().add(fact.getCell(defaultWorksheetIndex, 1, 0, "Caetegoty 1"));
chart.getChartData().getCategories().add(fact.getCell(defaultWorksheetIndex, 2, 0, "Caetegoty 2"));
chart.getChartData().getCategories().add(fact.getCell(defaultWorksheetIndex, 3, 0, "Caetegoty 3"));
// Mengambil seri diagram pertama
var series = chart.getChartData().getSeries().get_Item(0);
// Sekarang mengisi data seri
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, 1, 1, 20));
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, 2, 1, 50));
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, 3, 1, 30));
// Mengatur warna isi untuk seri
series.getFormat().getFill().setFillType(java.newByte(aspose.slides.FillType.Solid));
series.getFormat().getFill().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "RED"));
// Mengambil seri diagram kedua
series = chart.getChartData().getSeries().get_Item(1);
// Mengisi data seri
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, 1, 2, 30));
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, 2, 2, 10));
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, 3, 2, 60));
// Mengatur warna isi untuk seri
series.getFormat().getFill().setFillType(java.newByte(aspose.slides.FillType.Solid));
series.getFormat().getFill().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "GREEN"));
// Membuat label khusus untuk setiap kategori pada seri baru
// Mengatur label pertama agar menampilkan nama Kategori
var lbl = series.getDataPoints().get_Item(0).getLabel();
lbl.getDataLabelFormat().setShowCategoryName(true);
lbl = series.getDataPoints().get_Item(1).getLabel();
lbl.getDataLabelFormat().setShowSeriesName(true);
// Menampilkan nilai untuk label ketiga
lbl = series.getDataPoints().get_Item(2).getLabel();
lbl.getDataLabelFormat().setShowValue(true);
lbl.getDataLabelFormat().setShowSeriesName(true);
lbl.getDataLabelFormat().setSeparator("/");
// Menyimpan presentasi dengan diagram
pres.save("output.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
if (pres != null) {
pres.dispose();
}
}
Buat Diagram Scatter
Diagram scatter (juga dikenal sebagai scatter plot atau grafik x‑y) sering digunakan untuk memeriksa pola atau menunjukkan korelasi antara dua variabel.
Gunakan diagram scatter ketika:
- Anda memiliki data numerik berpasangan
- Anda memiliki dua variabel yang berpasangan dengan baik
- Anda ingin menentukan apakah dua variabel saling berhubungan
- Anda memiliki variabel independen yang memiliki banyak nilai untuk variabel dependen
- Ikuti langkah‑langkah di Buat Diagram Kolom Berkumpul .
- Pada langkah ketiga, tambahkan diagram dengan beberapa data dan tentukan tipe diagram Anda sebagai salah satu berikut:
- ChartType.ScatterWithMarkers - Mewakili diagram scatter.
- ChartType.ScatterWithSmoothLinesAndMarkers - Mewakili diagram scatter yang dihubungkan dengan kurva, dengan penanda data.
- ChartType.ScatterWithSmoothLines - Mewakili diagram scatter yang dihubungkan dengan kurva, tanpa penanda data.
- ChartType.ScatterWithStraightLinesAndMarkers - Mewakili diagram scatter yang dihubungkan dengan garis lurus, dengan penanda data.
- ChartType.ScatterWithStraightLines - Mewakili diagram scatter yang dihubungkan dengan garis lurus, tanpa penanda data.
Kode JavaScript ini menunjukkan cara membuat diagram scatter dengan penanda berbeda untuk setiap seri:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
// Membuat instance kelas presentasi yang mewakili file PPTX
var pres = new aspose.slides.Presentation();
try {
// Mengakses slide pertama
var slide = pres.getSlides().get_Item(0);
// Membuat diagram default
var chart = slide.getShapes().addChart(aspose.slides.ChartType.ScatterWithSmoothLines, 0, 0, 400, 400);
// Mendapatkan indeks worksheet data diagram default
var defaultWorksheetIndex = 0;
// Mendapatkan worksheet data diagram
var fact = chart.getChartData().getChartDataWorkbook();
// Menghapus seri demo
chart.getChartData().getSeries().clear();
// Menambahkan seri baru
chart.getChartData().getSeries().add(fact.getCell(defaultWorksheetIndex, 1, 1, "Series 1"), chart.getType());
chart.getChartData().getSeries().add(fact.getCell(defaultWorksheetIndex, 1, 3, "Series 2"), chart.getType());
// Mengambil seri diagram pertama
var series = chart.getChartData().getSeries().get_Item(0);
// Menambahkan titik baru (1:3) ke seri
series.getDataPoints().addDataPointForScatterSeries(fact.getCell(defaultWorksheetIndex, 2, 1, 1), fact.getCell(defaultWorksheetIndex, 2, 2, 3));
// Menambahkan titik baru (2:10)
series.getDataPoints().addDataPointForScatterSeries(fact.getCell(defaultWorksheetIndex, 3, 1, 2), fact.getCell(defaultWorksheetIndex, 3, 2, 10));
// Mengubah tipe seri
series.setType(aspose.slides.ChartType.ScatterWithStraightLinesAndMarkers);
// Mengubah penanda seri diagram
series.getMarker().setSize(10);
series.getMarker().setSymbol(aspose.slides.MarkerStyleType.Star);
// Mengambil seri diagram kedua
series = chart.getChartData().getSeries().get_Item(1);
// Menambahkan titik baru (5:2) di sana
series.getDataPoints().addDataPointForScatterSeries(fact.getCell(defaultWorksheetIndex, 2, 3, 5), fact.getCell(defaultWorksheetIndex, 2, 4, 2));
// Menambahkan titik baru (3:1)
series.getDataPoints().addDataPointForScatterSeries(fact.getCell(defaultWorksheetIndex, 3, 3, 3), fact.getCell(defaultWorksheetIndex, 3, 4, 1));
// Menambahkan titik baru (2:2)
series.getDataPoints().addDataPointForScatterSeries(fact.getCell(defaultWorksheetIndex, 4, 3, 2), fact.getCell(defaultWorksheetIndex, 4, 4, 2));
// Menambahkan titik baru (5:1)
series.getDataPoints().addDataPointForScatterSeries(fact.getCell(defaultWorksheetIndex, 5, 3, 5), fact.getCell(defaultWorksheetIndex, 5, 4, 1));
// Mengubah penanda seri diagram
series.getMarker().setSize(10);
series.getMarker().setSymbol(aspose.slides.MarkerStyleType.Circle);
pres.save("AsposeChart_out.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
if (pres != null) {
pres.dispose();
}
}
Buat Diagram Pai
Diagram pai paling cocok untuk menunjukkan hubungan bagian‑dengan‑keseluruhan dalam data, terutama ketika data berisi label kategori dengan nilai numerik. Namun, jika data Anda memiliki banyak bagian atau label, pertimbangkan menggunakan diagram batang sebagai gantinya.
- Buat sebuah instance dari kelas Presentation .
- Dapatkan referensi ke slide menggunakan indeksnya.
- Tambahkan diagram dengan data default dan tentukan tipe ChartType.Pie .
- Akses workbook data diagram ChartDataWorkbook .
- Hapus seri dan kategori default.
- Tambahkan seri dan kategori baru.
- Tambahkan data diagram baru untuk seri diagram.
- Tambahkan poin baru untuk diagram dan terapkan warna kustom untuk sektor diagram pai.
- Tetapkan label untuk seri.
- Aktifkan garis pemimpin untuk label seri.
- Tetapkan sudut rotasi untuk sektor diagram pai.
- Simpan presentasi yang telah dimodifikasi sebagai file PPTX.
Kode JavaScript ini menunjukkan cara membuat diagram pai:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
const java = require("java");
// Membuat instance kelas presentasi yang mewakili file PPTX
var pres = new aspose.slides.Presentation();
try {
// Mengakses slide pertama
var slides = pres.getSlides().get_Item(0);
// Menambahkan diagram dengan data default
var chart = slides.getShapes().addChart(aspose.slides.ChartType.Pie, 100, 100, 400, 400);
// Mengatur Judul diagram
chart.getChartTitle().addTextFrameForOverriding("Sample Title");
chart.getChartTitle().getTextFrameForOverriding().getTextFrameFormat().setCenterText(java.newByte(aspose.slides.NullableBool.True));
chart.getChartTitle().setHeight(20);
chart.setTitle(true);
// Mengatur seri pertama agar menampilkan nilai
chart.getChartData().getSeries().get_Item(0).getLabels().getDefaultDataLabelFormat().setShowValue(true);
// Mengatur indeks untuk lembar data diagram
var defaultWorksheetIndex = 0;
// Mendapatkan worksheet data diagram
var fact = chart.getChartData().getChartDataWorkbook();
// Menghapus seri dan kategori yang dihasilkan secara default
chart.getChartData().getSeries().clear();
chart.getChartData().getCategories().clear();
// Menambahkan kategori baru
chart.getChartData().getCategories().add(fact.getCell(0, 1, 0, "First Qtr"));
chart.getChartData().getCategories().add(fact.getCell(0, 2, 0, "2nd Qtr"));
chart.getChartData().getCategories().add(fact.getCell(0, 3, 0, "3rd Qtr"));
// Menambahkan seri baru
var series = chart.getChartData().getSeries().add(fact.getCell(0, 0, 1, "Series 1"), chart.getType());
// Mengisi data seri
series.getDataPoints().addDataPointForPieSeries(fact.getCell(defaultWorksheetIndex, 1, 1, 20));
series.getDataPoints().addDataPointForPieSeries(fact.getCell(defaultWorksheetIndex, 2, 1, 50));
series.getDataPoints().addDataPointForPieSeries(fact.getCell(defaultWorksheetIndex, 3, 1, 30));
// Tidak berfungsi pada versi baru
// Menambahkan titik baru dan mengatur warna sektor
// series.IsColorVaried = true;
chart.getChartData().getSeriesGroups().get_Item(0).setColorVaried(true);
var point = series.getDataPoints().get_Item(0);
point.getFormat().getFill().setFillType(java.newByte(aspose.slides.FillType.Solid));
point.getFormat().getFill().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "CYAN"));
// Mengatur batas sektor
point.getFormat().getLine().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.Solid));
point.getFormat().getLine().getFillFormat().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "GRAY"));
point.getFormat().getLine().setWidth(3.0);
point.getFormat().getLine().setStyle(java.newByte(aspose.slides.LineStyle.ThinThick));
point.getFormat().getLine().setDashStyle(java.newByte(aspose.slides.LineDashStyle.DashDot));
var point1 = series.getDataPoints().get_Item(1);
point1.getFormat().getFill().setFillType(java.newByte(aspose.slides.FillType.Solid));
point1.getFormat().getFill().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "ORANGE"));
// Mengatur batas sektor
point1.getFormat().getLine().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.Solid));
point1.getFormat().getLine().getFillFormat().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "BLUE"));
point1.getFormat().getLine().setWidth(3.0);
point1.getFormat().getLine().setStyle(java.newByte(aspose.slides.LineStyle.Single));
point1.getFormat().getLine().setDashStyle(java.newByte(aspose.slides.LineDashStyle.LargeDashDot));
var point2 = series.getDataPoints().get_Item(2);
point2.getFormat().getFill().setFillType(java.newByte(aspose.slides.FillType.Solid));
point2.getFormat().getFill().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "YELLOW"));
// Mengatur batas sektor
point2.getFormat().getLine().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.Solid));
point2.getFormat().getLine().getFillFormat().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "RED"));
point2.getFormat().getLine().setWidth(2.0);
point2.getFormat().getLine().setStyle(java.newByte(aspose.slides.LineStyle.ThinThin));
point2.getFormat().getLine().setDashStyle(java.newByte(aspose.slides.LineDashStyle.LargeDashDotDot));
// Membuat label khusus untuk setiap kategori pada seri baru
var lbl1 = series.getDataPoints().get_Item(0).getLabel();
// lbl.ShowCategoryName = true;
lbl1.getDataLabelFormat().setShowValue(true);
var lbl2 = series.getDataPoints().get_Item(1).getLabel();
lbl2.getDataLabelFormat().setShowValue(true);
lbl2.getDataLabelFormat().setShowLegendKey(true);
lbl2.getDataLabelFormat().setShowPercentage(true);
var lbl3 = series.getDataPoints().get_Item(2).getLabel();
lbl3.getDataLabelFormat().setShowSeriesName(true);
lbl3.getDataLabelFormat().setShowPercentage(true);
// Menampilkan Garis Pemimpin untuk Diagram
series.getLabels().getDefaultDataLabelFormat().setShowLeaderLines(true);
// Mengatur Sudut Rotasi untuk Sektor Diagram Pai
chart.getChartData().getSeriesGroups().get_Item(0).setFirstSliceAngle(180);
// Menyimpan presentasi dengan diagram
pres.save("PieChart_out.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
if (pres != null) {
pres.dispose();
}
}
Buat Diagram Garis
Diagram garis (juga dikenal sebagai grafik garis) paling cocok untuk situasi di mana Anda ingin menunjukkan perubahan nilai seiring waktu. Dengan diagram garis, Anda dapat membandingkan sejumlah besar data sekaligus, melacak perubahan dan tren seiring waktu, menyoroti anomali dalam seri data, dan lainnya.
- Buat sebuah instance dari kelas Presentation .
- Dapatkan referensi ke slide menggunakan indeksnya.
- Tambahkan diagram dengan data default dan tentukan tipe ChartType.Line .
- Akses workbook data diagram (ChartDataWorkbook ) .
- Hapus seri dan kategori default.
- Tambahkan seri dan kategori baru.
- Tambahkan data diagram baru untuk seri diagram.
- Simpan presentasi yang telah dimodifikasi sebagai file PPTX.
Kode JavaScript ini menunjukkan cara membuat diagram garis:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
var pres = new aspose.slides.Presentation();
try {
var lineChart = pres.getSlides().get_Item(0).getShapes().addChart(aspose.slides.ChartType.Line, 10, 50, 600, 350);
pres.save("lineChart.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
if (pres != null) {
pres.dispose();
}
}
Secara default, titik‑titik pada diagram garis dihubungkan oleh garis lurus kontinu. Jika Anda ingin titik‑titik tersebut dihubungkan oleh garis putus‑putus, Anda dapat menentukan tipe dash yang diinginkan sebagai berikut:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
const java = require("java");
var pres = new aspose.slides.Presentation();
try {
var lineChart = pres.getSlides().get_Item(0).getShapes().addChart(aspose.slides.ChartType.Line, 10, 50, 600, 350);
for (let i = 0; i < lineChart.getChartData().getSeries().size(); i++) {
let series = lineChart.getChartData().getSeries().get_Item(i);
series.getFormat().getLine().setDashStyle(java.newByte(aspose.slides.LineDashStyle.Dash));
}
pres.save("lineChart.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
if (pres != null) {
pres.dispose();
}
}
Buat Diagram Peta Pohon
Diagram peta pohon paling cocok untuk data penjualan ketika Anda ingin menunjukkan ukuran relatif kategori data dan dengan cepat menarik perhatian ke item yang memberikan kontribusi besar dalam setiap kategori.
- Buat sebuah instance dari kelas Presentation .
- Dapatkan referensi ke slide menggunakan indeksnya.
- Tambahkan diagram dengan data default dan tentukan tipe ChartType.Treemap .
- Akses workbook data diagram ChartDataWorkbook .
- Hapus seri dan kategori default.
- Tambahkan seri dan kategori baru.
- Tambahkan data diagram baru untuk seri diagram.
- Simpan presentasi yang telah dimodifikasi sebagai file PPTX.
Kode JavaScript ini menunjukkan cara membuat diagram peta pohon:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
var pres = new aspose.slides.Presentation();
try {
var chart = pres.getSlides().get_Item(0).getShapes().addChart(aspose.slides.ChartType.Treemap, 50, 50, 500, 400);
chart.getChartData().getCategories().clear();
chart.getChartData().getSeries().clear();
var wb = chart.getChartData().getChartDataWorkbook();
wb.clear(0);
// cabang 1
var leaf = chart.getChartData().getCategories().add(wb.getCell(0, "C1", "Leaf1"));
leaf.getGroupingLevels().setGroupingItem(1, "Stem1");
leaf.getGroupingLevels().setGroupingItem(2, "Branch1");
chart.getChartData().getCategories().add(wb.getCell(0, "C2", "Leaf2"));
leaf = chart.getChartData().getCategories().add(wb.getCell(0, "C3", "Leaf3"));
leaf.getGroupingLevels().setGroupingItem(1, "Stem2");
chart.getChartData().getCategories().add(wb.getCell(0, "C4", "Leaf4"));
// cabang 2
leaf = chart.getChartData().getCategories().add(wb.getCell(0, "C5", "Leaf5"));
leaf.getGroupingLevels().setGroupingItem(1, "Stem3");
leaf.getGroupingLevels().setGroupingItem(2, "Branch2");
chart.getChartData().getCategories().add(wb.getCell(0, "C6", "Leaf6"));
leaf = chart.getChartData().getCategories().add(wb.getCell(0, "C7", "Leaf7"));
leaf.getGroupingLevels().setGroupingItem(1, "Stem4");
chart.getChartData().getCategories().add(wb.getCell(0, "C8", "Leaf8"));
var series = chart.getChartData().getSeries().add(aspose.slides.ChartType.Treemap);
series.getLabels().getDefaultDataLabelFormat().setShowCategoryName(true);
series.getDataPoints().addDataPointForTreemapSeries(wb.getCell(0, "D1", 4));
series.getDataPoints().addDataPointForTreemapSeries(wb.getCell(0, "D2", 5));
series.getDataPoints().addDataPointForTreemapSeries(wb.getCell(0, "D3", 3));
series.getDataPoints().addDataPointForTreemapSeries(wb.getCell(0, "D4", 6));
series.getDataPoints().addDataPointForTreemapSeries(wb.getCell(0, "D5", 9));
series.getDataPoints().addDataPointForTreemapSeries(wb.getCell(0, "D6", 9));
series.getDataPoints().addDataPointForTreemapSeries(wb.getCell(0, "D7", 4));
series.getDataPoints().addDataPointForTreemapSeries(wb.getCell(0, "D8", 3));
series.setParentLabelLayout(aspose.slides.ParentLabelLayoutType.Overlapping);
pres.save("Treemap.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
if (pres != null) {
pres.dispose();
}
}
Buat Diagram Saham
- Buat sebuah instance dari kelas Presentation .
- Dapatkan referensi ke slide menggunakan indeksnya.
- Tambahkan diagram dengan data default dan tentukan tipe ChartType.OpenHighLowClose .
- Akses workbook data diagram ChartDataWorkbook .
- Hapus seri dan kategori default.
- Tambahkan seri dan kategori baru.
- Tambahkan data diagram baru untuk seri diagram.
- Tentukan format garis high‑low.
- Simpan presentasi yang telah dimodifikasi sebagai file PPTX.
Kode JavaScript ini menunjukkan cara membuat diagram saham:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
const java = require("java");
var pres = new aspose.slides.Presentation();
try {
var chart = pres.getSlides().get_Item(0).getShapes().addChart(aspose.slides.ChartType.OpenHighLowClose, 50, 50, 600, 400);
chart.getChartData().getCategories().clear();
chart.getChartData().getSeries().clear();
var wb = chart.getChartData().getChartDataWorkbook();
wb.clear(0);
chart.getChartData().getCategories().add(wb.getCell(0, 1, 0, "A"));
chart.getChartData().getCategories().add(wb.getCell(0, 2, 0, "B"));
chart.getChartData().getCategories().add(wb.getCell(0, 3, 0, "C"));
chart.getChartData().getSeries().add(wb.getCell(0, 0, 1, "Open"), chart.getType());
chart.getChartData().getSeries().add(wb.getCell(0, 0, 2, "High"), chart.getType());
chart.getChartData().getSeries().add(wb.getCell(0, 0, 3, "Low"), chart.getType());
chart.getChartData().getSeries().add(wb.getCell(0, 0, 4, "Close"), chart.getType());
var series = chart.getChartData().getSeries().get_Item(0);
series.getDataPoints().addDataPointForStockSeries(wb.getCell(0, 1, 1, 72));
series.getDataPoints().addDataPointForStockSeries(wb.getCell(0, 2, 1, 25));
series.getDataPoints().addDataPointForStockSeries(wb.getCell(0, 3, 1, 38));
series = chart.getChartData().getSeries().get_Item(1);
series.getDataPoints().addDataPointForStockSeries(wb.getCell(0, 1, 2, 172));
series.getDataPoints().addDataPointForStockSeries(wb.getCell(0, 2, 2, 57));
series.getDataPoints().addDataPointForStockSeries(wb.getCell(0, 3, 2, 57));
series = chart.getChartData().getSeries().get_Item(2);
series.getDataPoints().addDataPointForStockSeries(wb.getCell(0, 1, 3, 12));
series.getDataPoints().addDataPointForStockSeries(wb.getCell(0, 2, 3, 12));
series.getDataPoints().addDataPointForStockSeries(wb.getCell(0, 3, 3, 13));
series = chart.getChartData().getSeries().get_Item(3);
series.getDataPoints().addDataPointForStockSeries(wb.getCell(0, 1, 4, 25));
series.getDataPoints().addDataPointForStockSeries(wb.getCell(0, 2, 4, 38));
series.getDataPoints().addDataPointForStockSeries(wb.getCell(0, 3, 4, 50));
chart.getChartData().getSeriesGroups().get_Item(0).getUpDownBars().setUpDownBars(true);
chart.getChartData().getSeriesGroups().get_Item(0).getHiLowLinesFormat().getLine().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.Solid));
for (let i = 0; i < chart.getChartData().getSeries().size(); i++) {
let ser = chart.getChartData().getSeries().get_Item(i);
ser.getFormat().getLine().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.NoFill));
}
pres.save("output.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
if (pres != null) {
pres.dispose();
}
}
Buat Diagram Kotak‑dan‑Whisker
- Buat sebuah instance dari kelas Presentation .
- Dapatkan referensi ke slide menggunakan indeksnya.
- Tambahkan diagram dengan data default dan tentukan tipe ChartType.BoxAndWhisker .
- Akses workbook data diagram ChartDataWorkbook .
- Hapus seri dan kategori default.
- Tambahkan seri dan kategori baru.
- Tambahkan data diagram baru untuk seri diagram.
- Simpan presentasi yang telah dimodifikasi sebagai file PPTX.
Kode JavaScript ini menunjukkan cara membuat diagram kotak‑dan‑whisker:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
var pres = new aspose.slides.Presentation();
try {
var chart = pres.getSlides().get_Item(0).getShapes().addChart(aspose.slides.ChartType.BoxAndWhisker, 50, 50, 500, 400);
chart.getChartData().getCategories().clear();
chart.getChartData().getSeries().clear();
var wb = chart.getChartData().getChartDataWorkbook();
wb.clear(0);
chart.getChartData().getCategories().add(wb.getCell(0, "A1", "Category 1"));
chart.getChartData().getCategories().add(wb.getCell(0, "A2", "Category 1"));
chart.getChartData().getCategories().add(wb.getCell(0, "A3", "Category 1"));
chart.getChartData().getCategories().add(wb.getCell(0, "A4", "Category 1"));
chart.getChartData().getCategories().add(wb.getCell(0, "A5", "Category 1"));
chart.getChartData().getCategories().add(wb.getCell(0, "A6", "Category 1"));
var series = chart.getChartData().getSeries().add(aspose.slides.ChartType.BoxAndWhisker);
series.setQuartileMethod(aspose.slides.QuartileMethodType.Exclusive);
series.setShowMeanLine(true);
series.setShowMeanMarkers(true);
series.setShowInnerPoints(true);
series.setShowOutlierPoints(true);
series.getDataPoints().addDataPointForBoxAndWhiskerSeries(wb.getCell(0, "B1", 15));
series.getDataPoints().addDataPointForBoxAndWhiskerSeries(wb.getCell(0, "B2", 41));
series.getDataPoints().addDataPointForBoxAndWhiskerSeries(wb.getCell(0, "B3", 16));
series.getDataPoints().addDataPointForBoxAndWhiskerSeries(wb.getCell(0, "B4", 10));
series.getDataPoints().addDataPointForBoxAndWhiskerSeries(wb.getCell(0, "B5", 23));
series.getDataPoints().addDataPointForBoxAndWhiskerSeries(wb.getCell(0, "B6", 16));
pres.save("BoxAndWhisker.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
if (pres != null) {
pres.dispose();
}
}
Buat Diagram Corong
- Buat sebuah instance dari kelas Presentation .
- Dapatkan referensi ke slide menggunakan indeksnya.
- Tambahkan diagram dengan data default dan tentukan tipe ChartType.Funnel .
- Simpan presentasi yang telah dimodifikasi sebagai file PPTX.
Kode JavaScript ini menunjukkan cara membuat diagram corong:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
var pres = new aspose.slides.Presentation();
try {
var chart = pres.getSlides().get_Item(0).getShapes().addChart(aspose.slides.ChartType.Funnel, 50, 50, 500, 400);
chart.getChartData().getCategories().clear();
chart.getChartData().getSeries().clear();
var wb = chart.getChartData().getChartDataWorkbook();
wb.clear(0);
chart.getChartData().getCategories().add(wb.getCell(0, "A1", "Category 1"));
chart.getChartData().getCategories().add(wb.getCell(0, "A2", "Category 2"));
chart.getChartData().getCategories().add(wb.getCell(0, "A3", "Category 3"));
chart.getChartData().getCategories().add(wb.getCell(0, "A4", "Category 4"));
chart.getChartData().getCategories().add(wb.getCell(0, "A5", "Category 5"));
chart.getChartData().getCategories().add(wb.getCell(0, "A6", "Category 6"));
var series = chart.getChartData().getSeries().add(aspose.slides.ChartType.Funnel);
series.getDataPoints().addDataPointForFunnelSeries(wb.getCell(0, "B1", 50));
series.getDataPoints().addDataPointForFunnelSeries(wb.getCell(0, "B2", 100));
series.getDataPoints().addDataPointForFunnelSeries(wb.getCell(0, "B3", 200));
series.getDataPoints().addDataPointForFunnelSeries(wb.getCell(0, "B4", 300));
series.getDataPoints().addDataPointForFunnelSeries(wb.getCell(0, "B5", 400));
series.getDataPoints().addDataPointForFunnelSeries(wb.getCell(0, "B6", 500));
pres.save("Funnel.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
if (pres != null) {
pres.dispose();
}
}
Buat Diagram Sunburst
- Buat sebuah instance dari kelas Presentation .
- Dapatkan referensi ke slide menggunakan indeksnya.
- Tambahkan diagram dengan data default dan tentukan tipe ChartType.Sunburst .
- Simpan presentasi yang telah dimodifikasi sebagai file PPTX.
Kode JavaScript ini menunjukkan cara membuat diagram sunburst:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
var pres = new aspose.slides.Presentation();
try {
var chart = pres.getSlides().get_Item(0).getShapes().addChart(aspose.slides.ChartType.Sunburst, 50, 50, 500, 400);
chart.getChartData().getCategories().clear();
chart.getChartData().getSeries().clear();
var wb = chart.getChartData().getChartDataWorkbook();
wb.clear(0);
// cabang 1
var leaf = chart.getChartData().getCategories().add(wb.getCell(0, "C1", "Leaf1"));
leaf.getGroupingLevels().setGroupingItem(1, "Stem1");
leaf.getGroupingLevels().setGroupingItem(2, "Branch1");
chart.getChartData().getCategories().add(wb.getCell(0, "C2", "Leaf2"));
leaf = chart.getChartData().getCategories().add(wb.getCell(0, "C3", "Leaf3"));
leaf.getGroupingLevels().setGroupingItem(1, "Stem2");
chart.getChartData().getCategories().add(wb.getCell(0, "C4", "Leaf4"));
// cabang 2
leaf = chart.getChartData().getCategories().add(wb.getCell(0, "C5", "Leaf5"));
leaf.getGroupingLevels().setGroupingItem(1, "Stem3");
leaf.getGroupingLevels().setGroupingItem(2, "Branch2");
chart.getChartData().getCategories().add(wb.getCell(0, "C6", "Leaf6"));
leaf = chart.getChartData().getCategories().add(wb.getCell(0, "C7", "Leaf7"));
leaf.getGroupingLevels().setGroupingItem(1, "Stem4");
chart.getChartData().getCategories().add(wb.getCell(0, "C8", "Leaf8"));
var series = chart.getChartData().getSeries().add(aspose.slides.ChartType.Sunburst);
series.getLabels().getDefaultDataLabelFormat().setShowCategoryName(true);
series.getDataPoints().addDataPointForSunburstSeries(wb.getCell(0, "D1", 4));
series.getDataPoints().addDataPointForSunburstSeries(wb.getCell(0, "D2", 5));
series.getDataPoints().addDataPointForSunburstSeries(wb.getCell(0, "D3", 3));
series.getDataPoints().addDataPointForSunburstSeries(wb.getCell(0, "D4", 6));
series.getDataPoints().addDataPointForSunburstSeries(wb.getCell(0, "D5", 9));
series.getDataPoints().addDataPointForSunburstSeries(wb.getCell(0, "D6", 9));
series.getDataPoints().addDataPointForSunburstSeries(wb.getCell(0, "D7", 4));
series.getDataPoints().addDataPointForSunburstSeries(wb.getCell(0, "D8", 3));
pres.save("Sunburst.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
if (pres != null) {
pres.dispose();
}
}
Buat Diagram Histogram
- Buat sebuah instance dari kelas Presentation .
- Dapatkan referensi ke slide menggunakan indeksnya.
- Tambahkan diagram dengan data default dan tentukan tipe ChartType.Histogram .
- Akses workbook data diagram ChartDataWorkbook .
- Hapus seri dan kategori default.
- Tambahkan seri dan kategori baru.
- Simpan presentasi yang telah dimodifikasi sebagai file PPTX.
Kode JavaScript ini menunjukkan cara membuat diagram histogram:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
var pres = new aspose.slides.Presentation();
var chart = pres.getSlides().get_Item(0).getShapes().addChart(aspose.slides.ChartType.Histogram, 50, 50, 500, 400);
chart.getChartData().getCategories().clear();
chart.getChartData().getSeries().clear();
var wb = chart.getChartData().getChartDataWorkbook();
wb.clear(0);
var series = chart.getChartData().getSeries().add(aspose.slides.ChartType.Histogram);
series.getDataPoints().addDataPointForHistogramSeries(wb.getCell(0, "A1", 15));
series.getDataPoints().addDataPointForHistogramSeries(wb.getCell(0, "A2", -41));
series.getDataPoints().addDataPointForHistogramSeries(wb.getCell(0, "A3", 16));
series.getDataPoints().addDataPointForHistogramSeries(wb.getCell(0, "A4", 10));
series.getDataPoints().addDataPointForHistogramSeries(wb.getCell(0, "A5", -23));
series.getDataPoints().addDataPointForHistogramSeries(wb.getCell(0, "A6", 16));
chart.getAxes().getHorizontalAxis().setAggregationType(aspose.slides.AxisAggregationType.Automatic);
Buat Diagram Radar
- Buat sebuah instance dari kelas Presentation .
- Dapatkan referensi ke slide menggunakan indeksnya.
- Tambahkan diagram dengan beberapa data dan tentukan tipe diagram yang Anda inginkan (ChartType.Radar dalam kasus ini) .
- Simpan presentasi yang telah dimodifikasi sebagai file PPTX.
Kode JavaScript ini menunjukkan cara membuat diagram radar:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
var pres = new aspose.slides.Presentation();
try {
pres.getSlides().get_Item(0).getShapes().addChart(aspose.slides.ChartType.Radar, 20, 20, 400, 300);
pres.save("Radar-chart.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
if (pres != null) {
pres.dispose();
}
}
Buat Diagram Multi‑Kategori
- Buat sebuah instance dari kelas Presentation .
- Dapatkan referensi ke slide menggunakan indeksnya.
- Tambahkan diagram dengan data default dan tentukan tipe ChartType.ClusteredColumn .
- Akses workbook data diagram ChartDataWorkbook .
- Hapus seri dan kategori default.
- Tambahkan seri dan kategori baru.
- Tambahkan data diagram baru untuk seri diagram.
- Simpan presentasi yang telah dimodifikasi sebagai file PPTX.
Kode JavaScript ini menunjukkan cara membuat diagram multi‑kategori:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
var pres = new aspose.slides.Presentation();
try {
var ch = pres.getSlides().get_Item(0).getShapes().addChart(aspose.slides.ChartType.ClusteredColumn, 100, 100, 600, 450);
ch.getChartData().getSeries().clear();
ch.getChartData().getCategories().clear();
var fact = ch.getChartData().getChartDataWorkbook();
fact.clear(0);
var defaultWorksheetIndex = 0;
var category = ch.getChartData().getCategories().add(fact.getCell(0, "c2", "A"));
category.getGroupingLevels().setGroupingItem(1, "Group1");
category = ch.getChartData().getCategories().add(fact.getCell(0, "c3", "B"));
category = ch.getChartData().getCategories().add(fact.getCell(0, "c4", "C"));
category.getGroupingLevels().setGroupingItem(1, "Group2");
category = ch.getChartData().getCategories().add(fact.getCell(0, "c5", "D"));
category = ch.getChartData().getCategories().add(fact.getCell(0, "c6", "E"));
category.getGroupingLevels().setGroupingItem(1, "Group3");
category = ch.getChartData().getCategories().add(fact.getCell(0, "c7", "F"));
category = ch.getChartData().getCategories().add(fact.getCell(0, "c8", "G"));
category.getGroupingLevels().setGroupingItem(1, "Group4");
category = ch.getChartData().getCategories().add(fact.getCell(0, "c9", "H"));
// Menambahkan Seri
var series = ch.getChartData().getSeries().add(fact.getCell(0, "D1", "Series 1"), aspose.slides.ChartType.ClusteredColumn);
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, "D2", 10));
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, "D3", 20));
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, "D4", 30));
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, "D5", 40));
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, "D6", 50));
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, "D7", 60));
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, "D8", 70));
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, "D9", 80));
// Simpan presentasi dengan diagram
pres.save("AsposeChart_out.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
if (pres != null) {
pres.dispose();
}
}
Buat Diagram Peta
Diagram peta memvisualisasikan data geografis dan membantu membandingkan nilai antar wilayah.
Kode JavaScript ini menunjukkan cara membuat diagram peta:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
let pres = new aspose.slides.Presentation();
try {
let chart = pres.getSlides().get_Item(0).getShapes().addChart(aspose.slides.ChartType.Map, 50, 50, 500, 400);
pres.save("mapChart.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
if (pres != null) {
pres.dispose();
}
}
Buat Diagram Kombinasi
Diagram kombinasi (atau combo chart) menggabungkan dua atau lebih tipe diagram dalam satu grafik. Diagram ini memungkinkan Anda menyorot, membandingkan, atau memeriksa perbedaan antara dua atau lebih set data, membantu mengidentifikasi hubungan di antara mereka.

Kode JavaScript berikut menunjukkan cara membuat diagram kombinasi yang ditampilkan di atas dalam presentasi PowerPoint:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
const java = require("java");
function createComboChart() {
let presentation = new aspose.slides.Presentation();
let slide = presentation.getSlides().get_Item(0);
try {
let chart = createChartWithFirstSeries(slide);
addSecondSeriesToChart(chart);
addThirdSeriesToChart(chart);
setPrimaryAxesFormat(chart);
setSecondaryAxesFormat(chart);
presentation.save("combo-chart.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
presentation.dispose();
}
}
function createChartWithFirstSeries(slide) {
let chart = slide.getShapes().addChart(aspose.slides.ChartType.ClusteredColumn, 50, 50, 600, 400);
// Atur judul diagram.
chart.setTitle(true);
chart.getChartTitle().addTextFrameForOverriding("Chart Title");
chart.getChartTitle().setOverlay(false);
let titleParagraph = chart.getChartTitle().getTextFrameForOverriding().getParagraphs().get_Item(0);
let titleFormat = titleParagraph.getParagraphFormat().getDefaultPortionFormat();
titleFormat.setFontBold(java.newByte(aspose.slides.NullableBool.False));
titleFormat.setFontHeight(18);
// Atur legenda diagram.
chart.getLegend().setPosition(aspose.slides.LegendPositionType.Bottom);
chart.getLegend().getTextFormat().getPortionFormat().setFontHeight(12);
// Hapus seri dan kategori yang dihasilkan secara default.
chart.getChartData().getSeries().clear();
chart.getChartData().getCategories().clear();
const worksheetIndex = 0;
let workbook = chart.getChartData().getChartDataWorkbook();
// Tambahkan kategori baru.
chart.getChartData().getCategories().add(workbook.getCell(worksheetIndex, 1, 0, "Category 1"));
chart.getChartData().getCategories().add(workbook.getCell(worksheetIndex, 2, 0, "Category 2"));
chart.getChartData().getCategories().add(workbook.getCell(worksheetIndex, 3, 0, "Category 3"));
chart.getChartData().getCategories().add(workbook.getCell(worksheetIndex, 4, 0, "Category 4"));
// Tambahkan seri pertama.
let seriesNameCell = workbook.getCell(worksheetIndex, 0, 1, "Series 1");
let series = chart.getChartData().getSeries().add(seriesNameCell, chart.getType());
series.getParentSeriesGroup().setOverlap(java.newByte(-25));
series.getParentSeriesGroup().setGapWidth(220);
series.getDataPoints().addDataPointForBarSeries(workbook.getCell(worksheetIndex, 1, 1, 4.3));
series.getDataPoints().addDataPointForBarSeries(workbook.getCell(worksheetIndex, 2, 1, 2.5));
series.getDataPoints().addDataPointForBarSeries(workbook.getCell(worksheetIndex, 3, 1, 3.5));
series.getDataPoints().addDataPointForBarSeries(workbook.getCell(worksheetIndex, 4, 1, 4.5));
return chart;
}
function addSecondSeriesToChart(chart) {
let workbook = chart.getChartData().getChartDataWorkbook();
const worksheetIndex = 0;
let seriesNameCell = workbook.getCell(worksheetIndex, 0, 2, "Series 2");
let series = chart.getChartData().getSeries().add(seriesNameCell, aspose.slides.ChartType.ClusteredColumn);
series.getParentSeriesGroup().setOverlap(java.newByte(-25));
series.getParentSeriesGroup().setGapWidth(220);
series.getDataPoints().addDataPointForBarSeries(workbook.getCell(worksheetIndex, 1, 2, 2.4));
series.getDataPoints().addDataPointForBarSeries(workbook.getCell(worksheetIndex, 2, 2, 4.4));
series.getDataPoints().addDataPointForBarSeries(workbook.getCell(worksheetIndex, 3, 2, 1.8));
series.getDataPoints().addDataPointForBarSeries(workbook.getCell(worksheetIndex, 4, 2, 2.8));
}
function addThirdSeriesToChart(chart) {
let workbook = chart.getChartData().getChartDataWorkbook();
const worksheetIndex = 0;
let seriesNameCell = workbook.getCell(worksheetIndex, 0, 3, "Series 3");
let series = chart.getChartData().getSeries().add(seriesNameCell, aspose.slides.ChartType.Line);
series.getDataPoints().addDataPointForLineSeries(workbook.getCell(worksheetIndex, 1, 3, 2.0));
series.getDataPoints().addDataPointForLineSeries(workbook.getCell(worksheetIndex, 2, 3, 2.0));
series.getDataPoints().addDataPointForLineSeries(workbook.getCell(worksheetIndex, 3, 3, 3.0));
series.getDataPoints().addDataPointForLineSeries(workbook.getCell(worksheetIndex, 4, 3, 5.0));
series.setPlotOnSecondAxis(true);
}
function setPrimaryAxesFormat(chart) {
// Atur sumbu horizontal.
let horizontalAxis = chart.getAxes().getHorizontalAxis();
horizontalAxis.getTextFormat().getPortionFormat().setFontHeight(12);
horizontalAxis.getFormat().getLine().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.NoFill));
setAxisTitle(horizontalAxis, "X Axis");
// Atur sumbu vertikal.
let verticalAxis = chart.getAxes().getVerticalAxis();
verticalAxis.getTextFormat().getPortionFormat().setFontHeight(12);
verticalAxis.getFormat().getLine().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.NoFill));
setAxisTitle(verticalAxis, "Y Axis 1");
// Atur warna garis kisi utama vertikal.
let majorGridLinesFormat = verticalAxis.getMajorGridLinesFormat().getLine().getFillFormat();
majorGridLinesFormat.setFillType(java.newByte(aspose.slides.FillType.Solid));
majorGridLinesFormat.getSolidFillColor().setColor(java.newInstanceSync("java.awt.Color", 217, 217, 217));
}
function setSecondaryAxesFormat(chart) {
// Atur sumbu horizontal sekunder.
let secondaryHorizontalAxis = chart.getAxes().getSecondaryHorizontalAxis();
secondaryHorizontalAxis.setPosition(aspose.slides.AxisPositionType.Bottom);
secondaryHorizontalAxis.setCrossType(aspose.slides.CrossesType.Maximum);
secondaryHorizontalAxis.setVisible(false);
secondaryHorizontalAxis.getMajorGridLinesFormat().getLine().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.NoFill));
secondaryHorizontalAxis.getMinorGridLinesFormat().getLine().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.NoFill));
// Atur sumbu vertikal sekunder.
let secondaryVerticalAxis = chart.getAxes().getSecondaryVerticalAxis();
secondaryVerticalAxis.setPosition(aspose.slides.AxisPositionType.Right);
secondaryVerticalAxis.getTextFormat().getPortionFormat().setFontHeight(12);
secondaryVerticalAxis.getFormat().getLine().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.NoFill));
secondaryVerticalAxis.getMajorGridLinesFormat().getLine().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.NoFill));
secondaryVerticalAxis.getMinorGridLinesFormat().getLine().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.NoFill));
setAxisTitle(secondaryVerticalAxis, "Y Axis 2");
}
function setAxisTitle(axis, axisTitle) {
axis.setTitle(true);
axis.getTitle().setOverlay(false);
let titleParagraph = axis.getTitle().addTextFrameForOverriding(axisTitle).getParagraphs().get_Item(0);
let titleFormat = titleParagraph.getParagraphFormat().getDefaultPortionFormat();
titleFormat.setFontBold(java.newByte(aspose.slides.NullableBool.False));
titleFormat.setFontHeight(12);
}
Perbarui Diagram
- Buat sebuah instance dari kelas Presentation yang mewakili presentasi yang berisi diagram yang ingin Anda perbarui.
- Dapatkan referensi ke slide menggunakan indeksnya.
- Telusuri semua shape untuk menemukan diagram yang diinginkan.
- Akses worksheet data diagram.
- Modifikasi seri data diagram dengan mengubah nilai seri.
- Tambahkan seri baru dan isi datanya.
- Simpan presentasi yang telah dimodifikasi sebagai file PPTX.
Kode JavaScript ini menunjukkan cara memperbarui diagram:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
var pres = new aspose.slides.Presentation("ExistingChart.pptx");
try {
// Akses slide pertama
var sld = pres.getSlides().get_Item(0);
// Dapatkan diagram dengan data default
var chart = sld.getShapes().get_Item(0);
// Mengatur indeks lembar data diagram
var defaultWorksheetIndex = 0;
// Mendapatkan worksheet data diagram
var fact = chart.getChartData().getChartDataWorkbook();
// Mengubah Nama Kategori diagram
fact.getCell(defaultWorksheetIndex, 1, 0, "Modified Category 1");
fact.getCell(defaultWorksheetIndex, 2, 0, "Modified Category 2");
// Ambil seri diagram pertama
var series = chart.getChartData().getSeries().get_Item(0);
// Sekarang memperbarui data seri
fact.getCell(defaultWorksheetIndex, 0, 1, "New_Series1");// Memodifikasi nama seri
series.getDataPoints().get_Item(0).getValue().setData(90);
series.getDataPoints().get_Item(1).getValue().setData(123);
series.getDataPoints().get_Item(2).getValue().setData(44);
// Ambil seri diagram kedua
series = chart.getChartData().getSeries().get_Item(1);
// Sekarang memperbarui data seri
fact.getCell(defaultWorksheetIndex, 0, 2, "New_Series2");// Memodifikasi nama seri
series.getDataPoints().get_Item(0).getValue().setData(23);
series.getDataPoints().get_Item(1).getValue().setData(67);
series.getDataPoints().get_Item(2).getValue().setData(99);
// Sekarang, Menambahkan seri baru
chart.getChartData().getSeries().add(fact.getCell(defaultWorksheetIndex, 0, 3, "Series 3"), chart.getType());
// Ambil seri diagram ketiga
series = chart.getChartData().getSeries().get_Item(2);
// Sekarang mengisi data seri
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, 1, 3, 20));
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, 2, 3, 50));
series.getDataPoints().addDataPointForBarSeries(fact.getCell(defaultWorksheetIndex, 3, 3, 30));
chart.setType(aspose.slides.ChartType.ClusteredCylinder);
// Simpan presentasi dengan diagram
pres.save("AsposeChartModified_out.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
if (pres != null) {
pres.dispose();
}
}
Tetapkan Rentang Data untuk Diagram
Untuk menetapkan rentang data bagi diagram, lakukan hal berikut:
- Buat sebuah instance dari kelas Presentation yang mewakili presentasi yang berisi diagram.
- Dapatkan referensi ke slide menggunakan indeksnya.
- Telusuri semua shape untuk menemukan diagram yang diinginkan.
- Akses data diagram dan tetapkan rentangnya.
- Simpan presentasi yang telah dimodifikasi sebagai file PPTX.
Kode JavaScript ini menunjukkan cara menetapkan rentang data untuk diagram:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
var pres = new aspose.slides.Presentation("ExistingChart.pptx");
try {
var slide = pres.getSlides().get_Item(0);
var chart = slide.getShapes().get_Item(0);
chart.getChartData().setRange("Sheet1!A1:B4");
pres.save("SetDataRange_out.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
if (pres != null) {
pres.dispose();
}
}
Gunakan Penanda Default dalam Diagram
Saat Anda menggunakan penanda default dalam diagram, setiap seri diagram secara otomatis mendapatkan simbol penanda yang berbeda.
Kode JavaScript ini menunjukkan cara menetapkan penanda seri diagram secara otomatis:
var aspose = aspose || {};
aspose.slides = require("aspose.slides.via.java");
var pres = new aspose.slides.Presentation();
try {
var slide = pres.getSlides().get_Item(0);
var chart = slide.getShapes().addChart(aspose.slides.ChartType.LineWithMarkers, 10, 10, 400, 400);
chart.getChartData().getSeries().clear();
chart.getChartData().getCategories().clear();
var fact = chart.getChartData().getChartDataWorkbook();
chart.getChartData().getSeries().add(fact.getCell(0, 0, 1, "Series 1"), chart.getType());
var series = chart.getChartData().getSeries().get_Item(0);
chart.getChartData().getCategories().add(fact.getCell(0, 1, 0, "C1"));
series.getDataPoints().addDataPointForLineSeries(fact.getCell(0, 1, 1, 24));
chart.getChartData().getCategories().add(fact.getCell(0, 2, 0, "C2"));
series.getDataPoints().addDataPointForLineSeries(fact.getCell(0, 2, 1, 23));
chart.getChartData().getCategories().add(fact.getCell(0, 3, 0, "C3"));
series.getDataPoints().addDataPointForLineSeries(fact.getCell(0, 3, 1, -10));
chart.getChartData().getCategories().add(fact.getCell(0, 4, 0, "C4"));
series.getDataPoints().addDataPointForLineSeries(fact.getCell(0, 4, 1, null));
chart.getChartData().getSeries().add(fact.getCell(0, 0, 2, "Series 2"), chart.getType());
// Ambil seri diagram kedua
var series2 = chart.getChartData().getSeries().get_Item(1);
// Sekarang mengisi data seri
series2.getDataPoints().addDataPointForLineSeries(fact.getCell(0, 1, 2, 30));
series2.getDataPoints().addDataPointForLineSeries(fact.getCell(0, 2, 2, 10));
series2.getDataPoints().addDataPointForLineSeries(fact.getCell(0, 3, 2, 60));
series2.getDataPoints().addDataPointForLineSeries(fact.getCell(0, 4, 2, 40));
chart.setLegend(true);
chart.getLegend().setOverlay(false);
pres.save("DefaultMarkersInChart.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
if (pres != null) {
pres.dispose();
}
}
FAQ
Jenis diagram apa yang didukung oleh Aspose.Slides?
Aspose.Slides mendukung beragam chart types, termasuk bar, line, pie, area, scatter, histogram, radar, dan banyak lagi. Fleksibilitas ini memungkinkan Anda memilih tipe diagram yang paling tepat untuk kebutuhan visualisasi data Anda.
Bagaimana cara menambahkan diagram baru ke slide?
Untuk menambahkan diagram, pertama buat sebuah instance dari kelas Presentation , ambil slide yang diinginkan menggunakan indeksnya, kemudian panggil metode untuk menambahkan diagram, dengan menentukan tipe diagram dan data awal. Proses ini mengintegrasikan diagram langsung ke dalam presentasi Anda.
Bagaimana saya dapat memperbarui data yang ditampilkan dalam diagram?
Anda dapat memperbarui data diagram dengan mengakses workbook datanya (ChartDataWorkbook ), menghapus semua seri dan kategori default, kemudian menambahkan data kustom Anda. Hal ini memungkinkan Anda memperbarui diagram secara programatik untuk mencerminkan data terbaru.
Apakah memungkinkan menyesuaikan tampilan diagram?
Ya, Aspose.Slides menyediakan opsi penyesuaian yang luas. Anda dapat mengubah warna, font, label, legenda, dan elemen formatting elements lainnya untuk menyesuaikan tampilan diagram dengan kebutuhan desain spesifik Anda.