[Bug report]

[theatifmalik]

Version

0.3.4

Platforms

Android

Device Model

pixel 4a

flutter info

[√] Flutter (Channel stable, 3.10.6, on Microsoft Windows [Version 10.0.19044.2130], locale en-US)
    • Flutter version 3.10.6 on channel stable at D:\flutter                                      
    • Upstream repository https://github.com/flutter/flutter.git                                  
    • Framework revision f468f3366c (8 weeks ago), 2023-07-12 15:19:05 -0700                      
    • Engine revision cdbeda788a                                                                  
    • Dart version 3.0.6                                                                          
    • DevTools version 2.23.1                                                                     

[√] Windows Version (Installed version of Windows is version 10 or higher)

[√] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at C:\Users\atif.hussain\AppData\Local\Android\sdk
    • Platform android-34, build-tools 34.0.0
    • Java binary at: C:\Program Files\Android\Android Studio\jbr\bin\java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-b2043.56-9586694)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe

[X] Visual Studio - develop for Windows
    X Visual Studio not installed; this is necessary for Windows development.
      Download at https://visualstudio.microsoft.com/downloads/.
      Please install the "Desktop development with C++" workload, including all of its default components

[√] Android Studio (version 2022.2)
    • Android Studio at C:\Program Files\Android\Android Studio
    • Flutter plugin can be installed from:
       https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
       https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-b2043.56-9586694)

[√] IntelliJ IDEA Community Edition (version 2023.1)
    • IntelliJ at C:\Program Files\JetBrains\IntelliJ IDEA Community Edition 2023.1.2
    • Flutter plugin can be installed from:
       https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin version 231.9065

[√] VS Code (version 1.81.1)
    • VS Code at C:\Users\atif.hussain\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension can be installed from:
       https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter

[√] Connected device (4 available)
    • sdk gphone x86 64 (mobile) • emulator-5554 • android-x64    • Android 13 (API 33) (emulator)
    • Windows (desktop)          • windows       • windows-x64    • Microsoft Windows [Version 10.0.19044.2130]
    • Chrome (web)               • chrome        • web-javascript • Google Chrome 116.0.5845.179
    • Edge (web)                 • edge          • web-javascript • Microsoft Edge 116.0.1938.69

[√] Network resources
    • All expected network resources are available.

! Doctor found issues in 1 category.

How to reproduce?

When i add the new data to the chart the data is being added but the candles ae not moving to the end
I am using Getx and also using Obx on Interactive Chart Instance in main.dart but still the candles are not moving to the end after new data being added.

Logs

No response

Example code (optional)

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:interactive_chart/interactive_chart.dart';
import 'mock_data.dart';

void main() {
  runApp( MyApp());
}

class MyApp extends StatefulWidget {


   MyApp({super.key});

  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  RxList<CandleData> data = RxList<CandleData>();

void initState(){
  super.initState();
  data.value=MockDataTesla.candles??[];
}
  bool _darkMode = true;
  bool _showAverage = false;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        brightness: _darkMode ? Brightness.dark : Brightness.light,
      ),
      home: Scaffold(
        floatingActionButton:
        FloatingActionButton(onPressed: (){
          var newCandleData = [
            1634564552, // timestamp
            950.93,     // open
            1600.32, // high
            600.55,     // low
            988.44,     // close
            1928938889, // volume
          ];
          data.add(CandleData(
            timestamp: (newCandleData[0] * 1000).toInt(),
            open: newCandleData[1].toDouble(),
            high: newCandleData[2].toDouble(),
            low: newCandleData[3].toDouble(),
            close: newCandleData[4].toDouble(),
            volume: newCandleData[5].toDouble(),
          ));


        },
        child: Text('+'),
        ),

        appBar: AppBar(
          title: const Text("Interactive Chart Demo"),
          actions: [
            IconButton(
              icon: Icon(_darkMode ? Icons.dark_mode : Icons.light_mode),
              onPressed: () => setState(() => _darkMode = !_darkMode),
            ),
            IconButton(
              icon: Icon(
                _showAverage ? Icons.show_chart : Icons.bar_chart_outlined,
              ),
              onPressed: () {
                setState(() => _showAverage = !_showAverage);
                if (_showAverage) {
                  _computeTrendLines();
                } else {
                  _removeTrendLines();
                }
              },
            ),
          ],
        ),
        body: SafeArea(
          minimum: const EdgeInsets.all(24.0),
          child: Obx(() => Column(
            children: [
              Expanded(
                flex: 1,
                child: InteractiveChart(
                  /** Only [candles] is required */
                  candles: data,
                  /** Uncomment the following for examples on optional parameters */

                  /** Example styling */
                  style: ChartStyle(
                    priceGainColor: Colors.green,
                    priceLossColor: Colors.red,
                    volumeColor: Colors.teal.withOpacity(0.8),
                    trendLineStyles: [
                      Paint()
                        ..strokeWidth = 2.0
                        ..strokeCap = StrokeCap.round
                        ..color = Colors.deepOrange,
                      Paint()
                        ..strokeWidth = 4.0
                        ..strokeCap = StrokeCap.round
                        ..color = Colors.orange,
                    ],
                    priceGridLineColor: Colors.black,
                    priceLabelStyle: TextStyle(color: Colors.black),
                    timeLabelStyle: TextStyle(color: Colors.black),
                    selectionHighlightColor: Colors.red.withOpacity(0.2),
                    overlayBackgroundColor: Colors.blueGrey,
                    overlayTextStyle: TextStyle(color: Colors.red[100]),
                    timeLabelHeight: 32,
                    volumeHeightFactor: 0.2, // volume area is 20% of total height
                    // ),
                    /** Customize axis labels */
                    // timeLabel: (timestamp, visibleDataCount) => "📅",
                    // priceLabel: (price) => "${price.round()} 💎",
                    /** Customize overlay (tap and hold to see it)
                     ** Or return an empty object to disable overlay info. */
                    // overlayInfo: (candle) => {
                    //   "💎": "🤚    ",
                    //   "Hi": "${candle.high?.toStringAsFixed(2)}",
                    //   "Lo": "${candle.low?.toStringAsFixed(2)}",
                    // },
                    /** Callbacks */
                    // onTap: (candle) => print("user tapped on $candle"),
                    // onCandleResize: (width) => print("each candle is $width wide"),
                  ),
                ),
              ),
              const Expanded(
                flex: 1,
                  child: Text('+'),
              ),
            ],
          ))
        ),
      ),
    );
  }

  _computeTrendLines() {
    final ma7 = CandleData.computeMA(data, 7);
    final ma30 = CandleData.computeMA(data, 30);
    final ma90 = CandleData.computeMA(data, 90);

    for (int i = 0; i < data.length; i++) {
      data[i].trends = [ma7[i], ma30[i], ma90[i]];
    }
  }

  _removeTrendLines() {
    for (final data in data) {
      data.trends = [];
    }
  }
}

Contact

atif.infotechgroup@gmail.com