Unix Time displaying for dates between 0-9 when rendering of split headers when using a data in the Split By field #2520
Replies: 2 comments
-
|
I tried to edit but it wanted me to sign in, and I'm not going to make an account. For value All other values worked as expected for me. I removed the aggregation so its clear: <html>
<head>
<meta
name="viewport"
content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no"
/>
<link
rel="stylesheet"
crossorigin="anonymous"
href="https://cdn.jsdelivr.net/npm/@finos/perspective-viewer/dist/css/pro.css"
/>
<link
rel="stylesheet"
crossorigin="anonymous"
href="https://cdn.jsdelivr.net/npm/@finos/perspective-workspace/dist/css/pro.css"
/>
<script
type="module"
src="https://cdn.jsdelivr.net/npm/@finos/perspective-viewer@2.7.1/dist/cdn/perspective-viewer.js"
></script>
<script
type="module"
src="https://cdn.jsdelivr.net/npm/@finos/perspective-workspace@2.7.1/dist/cdn/perspective-workspace.js"
></script>
<script
type="module"
src="https://cdn.jsdelivr.net/npm/@finos/perspective-viewer-datagrid@2.7.1/dist/cdn/perspective-viewer-datagrid.js"
></script>
<script
type="module"
src="https://cdn.jsdelivr.net/npm/@finos/perspective-viewer-d3fc@2.7.1/dist/cdn/perspective-viewer-d3fc.js"
></script>
<style>
body {
display: flex;
flex-direction: column;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: 0;
padding: 0;
overflow: hidden;
}
</style>
</head>
<body>
<perspective-viewer id="viewer"></perspective-viewer>
<script type="module">
import perspective from "https://cdn.jsdelivr.net/npm/@finos/perspective@2.7.1/dist/cdn/perspective.js";
const worker = perspective.worker();
function createData(day) {
return {
timestamp: [
new Date(`2024-02-${day}`),
new Date(`2024-02-${day + 4}`),
new Date(`2024-02-${day + 1}`),
new Date(`2024-02-${day + 2}`),
new Date(`2024-02-${day + 3}`),
],
colA: ["0.1", "0.2", "0.3", "0.4", "0.5"],
colB: ["10.1", "10.2", "10.3", "10.4", "10.5"],
};
}
const viewerConfig = {
plugin: "Datagrid",
split_by: [],
plugin_config: {},
settings: true,
};
window.addEventListener("load", async () => {
const table = await worker.table(createData(5), {
index: "timestamp",
});
const viewer = document.getElementById("viewer");
viewer.load(table);
viewer.restore(viewerConfig);
const updateData = async () => {
const newData = createData(26);
await table.update(newData);
};
setTimeout(updateData, 3000);
});
</script>
</body>
</html> |
Beta Was this translation helpful? Give feedback.
-
|
Hello, thanks for your response. To clarify, this issue occurs when we have split by timestamp. I've added a button at the top of the page in the code sandbox for improved replication of the issue. Please find the "update Data" button and click it to reproduce the issue. I've also included screenshots of the behavior. Please find below when createdata function has a value between 1-9, unix time displays. Alternatively in the final two screenshots when create data is 15, the date displays in expected format. Link to codeSandbox repo https://codesandbox.io/p/sandbox/staging-thunder-8fp4lp |
Beta Was this translation helpful? Give feedback.
-
Bug Report
Perspective createData() interprets data correctly when dates are larger than 9. When rendering of split headers Dates between 0-9 inclusively do not render as expected when using a data in the Split By field
Steps to Reproduce:
Use Perspective Viewer to render the table
Expected Result:
Expected to see table render in expected format.
Actual Result:
When the createData function has a parameter passed that is below the number 9, the rendered output appears as UNIX time.
Reproduction, https://codesandbox.io/p/sandbox/suspicious-kapitsa-8fp4lp?file=%2Findex.html%3A97%2C39
Environment:
Perspective 2.7.1
MacOS Ventura 13.6.1
Chrome Browser 120.0.6099.234 (Official Build) (x86_64)
Beta Was this translation helpful? Give feedback.
All reactions