个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
24
4
我正在尝试预先缩放图表以显示当天。这是我的图表:
am4core.useTheme(am4themes_animated);
var chart = am4core.create("chartdiv", am4charts.XYChart);
chart.dataSource.url = "https://api.myjson.com/bins/vz0pg";
chart.dataSource.events.on("parseended", function(ev) {
var data = ev.target.data;
data.sort(function(lhs, rhs) {
return lhs.time - rhs.time;
});
data.forEach(function(item) {
item.time *= 1000;
});
});
chart.numberFormatter.numberFormat = "#.0b";
chart.dateFormatter.inputDateFormat = "x";
var dateAxis = chart.xAxes.push(new am4charts.DateAxis());
dateAxis.dateFormats.setKey("minute", "d MMM, \nHH:mm");
dateAxis.periodChangeDateFormats.setKey("minute", "d MMM, \nHH:mm");
dateAxis.dateFormats.setKey("hour", "d MMM, \nHH:mm");
dateAxis.periodChangeDateFormats.setKey("hour", "d MMM, \nHH:mm");
dateAxis.startLocation = 0.5;
dateAxis.endLocation = 0.5;
var valueAxis = chart.yAxes.push(new am4charts.ValueAxis());
valueAxis.tooltip.disabled = true;
var series = chart.series.push(new am4charts.LineSeries());
series.dataFields.dateX = "time";
series.name = "Traffic out";
series.dataFields.valueY = "outDiffFormatted";
series.tooltipHTML = "<span style='font-size:14px; color:#000000;'><b>{valueY.value}</b></span>";
series.tooltipText = "[#000]{valueY.value}[/]";
series.tooltip.background.fill = am4core.color("#FFF");
series.tooltip.getStrokeFromObject = true;
series.tooltip.background.strokeWidth = 3;
series.tooltip.getFillFromObject = false;
series.fillOpacity = 0.6;
series.strokeWidth = 2;
series.stacked = false;
var series2 = chart.series.push(new am4charts.LineSeries());
series2.dataFields.dateX = "time";
series2.name = "Traffic in";
series2.dataFields.valueY = "inDiffFormatted";
series2.tooltipHTML = "<span style='font-size:14px; color:#000000;'><b>{valueY.value}</b></span>";
series2.tooltipText = "[#000]{valueY.value}[/]";
series2.tooltip.background.fill = am4core.color("#FFF");
series2.tooltip.getFillFromObject = false;
series2.tooltip.getStrokeFromObject = true;
series2.tooltip.background.strokeWidth = 3;
series2.sequencedInterpolation = true;
series2.fillOpacity = 0.5;
series2.stacked = false;
series2.strokeWidth = 2;
chart.cursor = new am4charts.XYCursor();
chart.cursor.lineY.opacity = 0;
chart.cursor.xAxis = dateAxis;
chart.scrollbarX = new am4charts.XYChartScrollbar();
chart.scrollbarX.series.push(series);
chart.legend = new am4charts.Legend();
chart.legend.position = "top";
chart.events.on("ready", function () {
dateAxis.zoomToDates(
new Date(2019, 5, 02),
new Date(2019, 5, 03)
);
});body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}
#chartdiv {
width: 100%;
height: 500px;
}<!DOCTYPE html>
<html>
<head>
<style>
</style>
</head>
<body>
<script src="https://www.amcharts.com/lib/4/core.js"></script>
<script src="https://www.amcharts.com/lib/4/charts.js"></script>
<script src="https://www.amcharts.com/lib/4/themes/animated.js"></script>
<div id="chartdiv"></div>
</body>
</html>这是我添加的代码:
chart.events.on("ready", function () {
dateAxis.zoomToDates(
new Date(2019, 5, 02),
new Date(2019, 5, 03)
);
});
我预计从 2019 年 5 月 3 日 00:00 缩放至 2019 年 5 月 4 日 23:59
最佳答案
您正在外部加载数据。这意味着当 "ready" 事件启动时数据尚不可用，因此您的 zoomToDates() 调用会“空白”。
您最好使用“datavalidated”事件，该事件将在数据加载并准备就绪时启动，因此这是预缩放图表的好时机。
chart.events.on("datavalidated", function () {
dateAxis.zoomToDates(
new Date(2019, 5, 02),
new Date(2019, 5, 03)
);
});
关于javascript - 如何在时间戳上预先缩放到当天，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55967912/
24
4
0
给定一个带有多个 date_time 戳的字符串，我想 提取第一个戳及其前面的文本 候选字符串可以有一个或多个时间戳 后续的 date_time 戳记将被 sep="-" 隔开 后续date_time
是否可以合并从相机拍摄的文本和照片？我想在照片上标记日期和时间，但我在 Google 上找不到任何内容。 最佳答案 使用下面的代码来实现你所需要的。 Bitmap src = Bitm
有没有办法通过 Graph API 戳另一个用户？基于this post ，并使用 Graph Explorer ，我发布到“/USERID/pokes”，我已经授予它(Graph API 应用程序和
我有两个向左浮动的元素。一个是 body 的第一个 child ，另一个是容器的第一个 child ，容器是 body 的第二个 child 。 ...
我是一名优秀的程序员,十分优秀！