我正在尝试使用Google Visualization API创建折线图.我想启用缩放.文件说'探险家'选项很有用.但是当我尝试使用"资源管理器"选项时,会显示图表,但缩放不起作用.
这是我的代码:
function drawVisualization(dataValues) {
var data = new window.google.visualization.DataTable();
data.addColumn('date', 'Date');
data.addColumn('number', 'Count');
for (var i = 0; i < dataValues.length; i++) {
data.addRow([new Date(dataValues[i].Year, dataValues[i].Month-1, dataValues[i].Day), dataValues[i].Count]);
}
var formatter_short = new google.visualization.DateFormat({ formatType: 'short' });
formatter_short.format(data, 0);
var options = {
title: "Time statistics",
explorer: { maxZoomOut: 8 }
};
var chart = new google.visualization.LineChart(document.getElementById('date'));
chart.draw(data, options);
}
Run Code Online (Sandbox Code Playgroud)
如何解决此问题并使折线图可缩放?
我正在尝试在一个 flex 容器内创建一排两列的布局。这是代码http://jsfiddle.net/73574emn/1/。
我想要的是使行始终保持在列上方,并使两列保持在同一行上。显然,现在如果我将窗口设置得太小,那么 column3 将在 column2 下向下移动,因为flex-wrap属性设置为wrap(因为我需要行和列在不同的行上)。
我想我可以将行包装在一个 flex 容器中,并将两列包装在另一个中,但我想知道当它们在同一个容器中时是否有任何方法可以做到这一点,如果是,那么它是如何工作的。也许我可以用宽度或最小宽度做一些事情?
*
{
box-sizing: border-box;
}
.flex
{
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.row {
background-color: green;
flex: 0 1 100%;
}
.column1 {
background-color: red;
flex: 1 0 50%;
text-align: center;
padding: 10px;
}
.column2 {
background-color: yellow;
flex: 1 0 50%;
text-align: center;
padding: 10px;
}Run Code Online (Sandbox Code Playgroud)
<div class="flex">
<div class='row'>Hithis is a long test sentence this is a …Run Code Online (Sandbox Code Playgroud)