Comments (4)
It seems it is a flutter engine-related issue
So, let's wait to see what happens
from fl_chart.
OK, thank you. Let's hope this gets resolved soon.
For anyone that might be looking for a solution, I have discovered the following workaround: you can use stack to render the same chart twice (one on top of the other), once in the reversed order and once in the original order, like this:
SizedBox(
width: MediaQuery.of(context).size.width,
height: 200,
child: Stack(
children: [
// First chart, drawing in the reversed order
LineChart(
LineChartData(
lineTouchData: const LineTouchData(
enabled: false,
),
lineBarsData: [
LineChartBarData(
spots: chartData.reversed.toList(),
dotData: const FlDotData(
show: false,
),
),
],
),
),
// Second chart, drawing in the original order
LineChart(
LineChartData(
lineTouchData: const LineTouchData(
enabled: false,
),
lineBarsData: [
LineChartBarData(
spots: chartData,
dotData: const FlDotData(
show: false,
),
),
],
),
),
],
),
)
You end up with two charts, on the first one the stroke ends are pointed towards the left side of the screen and on the other one towards the right side of the screen. But because they are displayed in a stack they are perfectly aligned and look like a properly rendered chart.
You can also limit this workaround to iOS to avoid unnecessarily impacting the performance of the app on other devices:
if (Platform.isIOS) {
// Draw two charts in a stack, like in the code above
} else {
// Draw chart normally
}
from fl_chart.
I am also interested in solving this problem...
from fl_chart.
Duplicate of #1625
from fl_chart.
Related Issues (20)
- Rounded corner radius for PieChart
- RangeError (length): Invalid value: Not in inclusive range 0..3: 4. Error thrown HOT 1
- How can I display both bar charts and line charts in the same chart? HOT 1
- Adding more lines to the same chart panel in realtime? HOT 9
- Improve performance on calculating minX, maxX, minY and maxY in axis-based charts
- Please, add gradient colours for the line depending on Y value for the LineChart (for example if y > 10 I need to set one color for the line, if y > 100 it should be another color) HOT 1
- Is it possible to scroll? HOT 2
- Get Rounded Cap at the End of a Donut Chart.
- Adding Option to add Custom Shadow to Charts
- Add or subtract from minX, miny, maxX and maxY
- Dithering bug HOT 3
- more a question: Show titles before / beyond meta.min / max?
- extra line with some additional details
- fixedLeftColumns is not reflecting using DataTable2 (Tested on web)
- Scatter plot with different marker ?
- displaying LineTooltipItem when clicking on SideTitleWidget HOT 1
- Side titles issue
- Build failure with Flutter 3.22.2 HOT 2
- Hacky solution for zooming and displaying extra data / titles across the chart
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from fl_chart.