通过Vaadin Flow实时更新ApexChart

时间:2020-05-14 02:34:08

标签: arduino esp8266 vaadin-flow openjdk-11

我现在要呈现的代码是使用vaadin和ApexChart插件制作的,我只想实时更新线型图,我在MainView中有@Push批注,并有一个ScheduledExecutorService每秒运行一次

Vaadin版本14.1.27

Apexcharts插件

    <dependency>
       <groupId> com.github.appreciated </groupId>
       <artifactId> apexcharts </artifactId>
       <version> 2.0.0.beta9 </version>
    </dependency>

Apache Tomcat / 9.0.27

我提出一个简单的请求,然后在access(()-> )方法中,最后调用chart.updateSeries()

代码

    public void updateChar() {
  
         final ApexCharts chart = ApexChartsBuilder.get().withChart(ChartBuilder.get()
                    .withType(Type.line)
                    .withAnimations(AnimationsBuilder.get()
                            .withEnabled(true)
                            .withEasing(Easing.linear)
                            .withDynamicAnimation(DynamicAnimationBuilder.get()
                                    .withSpeed(1000)
                                    .build())
                            .build())
                    .build())
                    .withDataLabels(DataLabelsBuilder.get()
                            .withEnabled(false)
                            .build())
                    .withSeries(new Series<>(0))
                    .withXaxis(XAxisBuilder.get()
                            .withCategories()
                            .withMax(10.0)
                            .build())
                    .build();
     
           chart.setHeight("400px");
           chart.setWidth("400px");
    
           schedule.scheduleAtFixedRate(() -> {
                    try {
                        final CompletableFuture<String> cf = HttpClient
                                .newBuilder()
                                .build()
                                .sendAsync(HttpRequest
                                                .newBuilder(new URI(HUMIDITY))
                                                .GET()
                                                .version(HttpClient.Version.HTTP_2)
                                                .build(),
                                        HttpResponse.BodyHandlers.ofString())
                                .thenApplyAsync(HttpResponse::body);
                        cf.whenCompleteAsync((data, error) -> {
                            if (getUI().isEmpty()) return;
                            if (Objects.nonNull(error)) {
                                cf.completeExceptionally(error);
                                getUI().get().access(() -> {
                                    Notification.show("Error: " + error);
                                });
                            } else {
                                if (getUI().isEmpty()) return;
                                getUI().get().access(() -> {
                                    final SecureRandom random = new SecureRandom();
                                    final Series<Double> series = new Series<>(25.2, 30.2, 25.77, 45.66, 60.00, 55.5);
                                    final Series<Double> serie1 = new Series<>(30.3, 34.10, 20.11, 12.15, 55.66, 82.5, 64.35, 100.4, 77.66, 14.32, 25.77);
                                    final Series<Double> serie2 = new Series<>(25.5, 55.3, 44.5, 99.6, 10.3, 44.6, 36.6);
                                    final Series[] randomSeries = new Series[]{series, serie1, serie2, series};
                                    //chart.updateSeries(radomSeries[SECURE_RANDOM.nextInt(randomSeries .length)]);
        
                                    chart.updateSeries(new Series<>(data));
                                });
        
                            }
                        }, EXEC)
                                .join();
                    } catch (URISyntaxException e) {
                        throw new RuntimeException();
                    }
                }, 1, 1, TimeUnit.SECONDS);


    } 

不幸的是,结果与预期不符,使用相同的代码,我能够更新TextFields


Dry Paint

0 个答案:

没有答案