appreciated/apexcharts-flow

Chart doesn't appear without error. Apex-charts-wrapper has size 0x0

Opened this issue · 2 comments

Hi! I am stuck with one problem. When I try to print LineChart, created Div and I expect that the chart to be inside. But, Div was created empty. What could be the problem?
Technologies: Java 11, vaadin 23.2.0, ApexCharts 23.0.0, Spring boot.

Screenshot_3
Screenshot_4

public class LineChart extends Div {

    public LineChart(List<String> categories, Integer[] data, String dataName) {
        setWidth("100%");
        setHeight("500px");
        ApexCharts lineChart = ApexChartsBuilder.get()
                .withChart(ChartBuilder.get()
                        .withType(Type.LINE)
                        .withZoom(ZoomBuilder.get()
                                .withEnabled(false)
                                .build())
                        .build())
                .withStroke(StrokeBuilder.get()
                        .withCurve(Curve.STRAIGHT)
                        .build())
                .withTitle(TitleSubtitleBuilder.get()
                        .withText("Product Trends by Month")
                        .withAlign(Align.LEFT)
                        .build())
                .withGrid(GridBuilder.get()
                        .withRow(RowBuilder.get()
                                .withColors("#f3f3f3", "transparent")
                                .withOpacity(0.5).build()
                        ).build())
                .withXaxis(XAxisBuilder.get()
                        .withCategories("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep")
                        .build())
                .withSeries(new Series<>("Desktops", 10.0, 41.0, 35.0, 51.0, 49.0, 62.0, 69.0, 91.0, 148.0))
                .build();
        lineChart.setHeight("100%");
        lineChart.setHeight("100%");
        add(lineChart);
    }
}

make sure that on your application.properties you have included com.github.appreciated on vaadin.whitelisted-packages key

your application.properties should look like this:
vaadin.whitelisted-packages = com.vaadin,org.vaadin,dev.hilla,com.github.appreciated

Thanks for the answer. Actually, I tried that but I get next error:

Failed to resolve import "@vaadin/combo-box/src/vaadin-combo-box-dropdown.js" from "node_modules\multiselect-combo-box\theme\lumo\multiselect-combo-box.js". Does the file exist?
11:33:22 [vite] Internal server error: Failed to resolve import "@vaadin/combo-box/src/vaadin-combo-box-dropdown.js" from "node_modules\multiselect-combo-box\theme\lumo\multiselect-combo-box.js". Does the file exist?
Plugin: vite:import-analysis
File: C:/Users/Plaho/IdeaProjects/KataProject/trade_front-dev/node_modules/.vite/deps/multiselect-combo-box_theme_lumo_multiselect-combo-box__js.js?v=0e653c2e
243|  // node_modules/multiselect-combo-box/src/multiselect-combo-box-dropdown.js
244|  import { html as html2 } from "@polymer/polymer/lib/utils/html-tag.js";
245|  import { ComboBoxDropdown } from "@vaadin/combo-box/src/vaadin-combo-box-dropdown.js";
      |                                                                ^
246|  var MultiselectComboBoxDropdown = class extends ComboBoxDropdown {
247|    static get is() {

I understand that "@vaadin/combo-box/src/vaadin-combo-box-dropdown.js" not found but where I can get this file?
I tried delete node_modules and installing again using file "package.json" but this didn't solve the problem. So, I don't know what I should do.
Error