[英]Disable the zoom factor on loading the Google Chart
I am working on a project in which I want to disable or modify the zoom factor (Default zoom) on loading the google map. 我正在一个项目中,我想在加载Google地图时禁用或修改缩放系数(默认缩放)。 But I am unable to do it.
但是我做不到。 When the activity starts it show following;
活动开始时,将显示以下内容;
Code is; 代码是;
<html>
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {
callback: function () {
drawChart();
window.addEventListener('resize', drawChart, false);
},
packages:['corechart']
});
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Year', 'Sales', 'Expenses', 'Profit'],
['2014', 1000, 400, 200],
['2015', 1170, 460, 250],
['2016', 660, 1120, 300],
['2017', 1030, 540, 350]
]);
var options = {
animation:{
duration: 1000,
easing: 'linear',
startup: true
},
height: 600,
theme: 'material',
title: 'Company Performance'
};
var chart = new google.visualization.ColumnChart(document.getElementById('columnchart_material'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="columnchart_material" style="width: 900px; height: 500px;"></div>
</body>
</html>
Example: I want to fit the complete Chart in 300*300 dimensions. 示例:我想将整个图表适合300 * 300尺寸。
the chart will fill the width of the container 图表将填充容器的宽度
see following working snippet... 请参阅以下工作片段...
google.charts.load('current', { callback: function () { drawChart(); window.addEventListener('resize', drawChart, false); }, packages:['corechart'] }); function drawChart() { var data = google.visualization.arrayToDataTable([ ['Year', 'Sales', 'Expenses', 'Profit'], ['2014', 1000, 400, 200], ['2015', 1170, 460, 250], ['2016', 660, 1120, 300], ['2017', 1030, 540, 350] ]); var options = { animation:{ duration: 1000, easing: 'linear', startup: true }, height: 600, theme: 'material', title: 'Company Performance' }; var chart = new google.visualization.ColumnChart(document.getElementById('columnchart_material')); chart.draw(data, options); }
#columnchart_material{ width: 300px; }
<script src="https://www.gstatic.com/charts/loader.js"></script> <div id="columnchart_material"></div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.