-
|
Here’s a simplified version of a function creating a chart (the real one has multiple series): pub fn register_chart(
transactions: impl Iterator<Item = (Date, f64)>,
) -> Result<Chart, HledgerWebError> {
let date_format = time::macros::format_description!("[year]-[month]-[day]T00:00:00.000Z");
let mut data: HashMap<String, Vec<(f64, String)>> = HashMap::new();
let mut dates = vec![];
let mut running_total = vec![];
for transaction in transactions {
let (date, q) = transaction;
running_total.push((
q,
date.format(&date_format)
.map_err(|e| HledgerWebError::FormatDateError(e))?,
));
dates.push(
date.format(&date_format)
.map_err(|e| HledgerWebError::FormatDateError(e))?,
);
}
let mut chart = Chart::new()
.legend(Legend::new())
.y_axis(Axis::new().type_(AxisType::Value));
trace!(?dates, ?data, "adding X axis");
chart = chart.x_axis(Axis::new().type_(AxisType::Time).data(dates));
chart = chart.series(Line::new().name("Total").data(running_total));
Ok(chart)
}Rendering this with I’m using this date format because I saw it in some ECharts snippets here and there, but it doesn’t seem to produce the desired result: an X-axis starting from roughly the first date and ending at roughly the last date, not counting padding, with ticks for the days in between, all aligned with the line representing the series. I’d appreciate any advice on how to get that. |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment 4 replies
-
|
On what echarts snippets did you see this formatting? Based on this Stack Overlfow answer (by Patrick Mevzek) and this ECharts example I would assume this formatting YYYY/MM/DDTHH:MM:SS. If you could provide a complete code example I might be able to help you further. |
Beta Was this translation helpful? Give feedback.
-
|
I started out with let mut chart = Chart::new()
.legend(Legend::new())
.y_axis(Axis::new().type_(AxisType::Value));
chart = chart.x_axis(Axis::new().type_(AxisType::Time).data(vec![
"2024/11/02T00:00:00",
"2024/11/03T00:00:00",
"2024/11/01T00:00:00",
]));
chart = chart.series(Line::new().data(vec![
(34, "2024/11/02T00:00:00"),
(30, "2024/11/01T00:00:00"),
(5, "2024/11/03T00:00:00"),
]));
let mut renderer = ImageRenderer::new(1000, 1000);
renderer.render(&chart)Which produces a stranger X-axis with what look like millisecond values added: Note that I deliberately have the dates out of order here, but my original code has them in order. It doesn’t seem to make a difference. |
Beta Was this translation helpful? Give feedback.
-
|
I think this should work. It is poorly documented here and in echarts. let mut chart = Chart::new()
.legend(Legend::new())
.y_axis(Axis::new().type_(AxisType::Value));
chart = chart.x_axis(Axis::new().type_(AxisType::Time));
chart = chart.series(Line::new().data(vec![
vec!["2024/11/01T00:00:00", "30"],
vec!["2024/11/02T00:00:00", "34"],
vec!["2024/11/03T00:00:00", "5"],
]));Edit: Removed unnecessary tuple data |
Beta Was this translation helpful? Give feedback.
-
|
I do believe that did the trick! It seems to work without the second value in the tuple too. What should that be doing in your example? Thank you again for answering, and for finding the solution. Here’s an example of a chart I was able to build:
|
Beta Was this translation helpful? Give feedback.
-
|
I am not sure what the second value is for, I removed it from my example. |
Beta Was this translation helpful? Give feedback.
I think this should work. It is poorly documented here and in echarts.
Edit: Removed unnecessary tuple data