Google图表日志规模 [英] Google charts log scale
问题描述
我试图在Google图表中做一个对数比例图（实际上是一个半圆图，准确），并尝试过
vAxis：{
scaleType ：'log'
}
没有成功。我也看到了Google的例子（ ...
Google Charts的版本可通过
jsapiloader不再一致地更新。请从现在开始使用新的gstatic加载器（loader.js）。
请参阅以下工作片段...
google.charts.load（'current'，{callback：function（）{var data = google.visualization.arrayToDataTable（[['Index'，'Value' ]，['1'，100000]，['2'，2170]，['3'，960]，['4'，560]，['5'，520]，['6'，500] ['7'，480]，['8'，460]，['9'，440]，['10'，430]，['11'，420]，['12'，410] ['16'，'38']，['17'，396]，['18'，387]，['19' ，385]，['20'，384]]）; var chart = new google.visualization.LineChart（document.getElementById（'chart_div'））; chart.draw（data，{wid th：400，height：240，legend：'bottom'，title：'Company Performance'，vAxis：{scaleType：'log'}}）; }，packages：['corechart']}）;
这里是相同的图表，没有选项 - > vAxis ：{scaleType：'log'}
I'm trying to do a log scale plot in Google Charts(actually a semilogy plot, to be accurate) and have tried
vAxis: {
scaleType: 'log'
}
without success. I have seen also Google's example(https://jsfiddle.net/api/post/library/pure/), but haven't figured out where I am mistaken.
In order to reproduce my problem I've taken the simple Line Chart where i modified some entry values to look similar like values from f(x) = 1/x, like my actual data is distributed.
<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("visualization", "1", {packages:["linechart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Index', 'Value'],
['1', 100000],
['2', 2170],
['3', 960],
['4', 560],
['5', 520],
['6', 500],
['7', 480],
['8', 460],
['9', 440],
['10', 430],
['11', 420],
['12', 410],
['13', 400],
['14', 395],
['15', 390],
['16', 388],
['17', 396],
['18', 387],
['19', 385],
['20', 384]
]);
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data, {width: 400, height: 240, legend: 'bottom', title: 'Company Performance', vAxis: {scaleType: 'log'}});
}
</script>
</head>
<body>
<div id="chart_div"></div>
</body>
</html>
My last option parameter vAxis: {scaleType: 'log'} is ignored. I ahve tried with both discrete and continuous data(1st column both as strings like above or numbers without the '') My plot looks like the one below
using the updated library (loader.js) seems to make a difference
<script src="https://www.gstatic.com/charts/loader.js"></script>
instead of...
<script src="https://www.google.com/jsapi"></script>
plus, from the release notes...
The version of Google Charts that remains available via the
jsapiloader is no longer being updated consistently. Please use the new gstatic loader (loader.js) from now on.
see following working snippet...
google.charts.load('current', {
callback: function () {
var data = google.visualization.arrayToDataTable([
['Index', 'Value'],
['1', 100000],
['2', 2170],
['3', 960],
['4', 560],
['5', 520],
['6', 500],
['7', 480],
['8', 460],
['9', 440],
['10', 430],
['11', 420],
['12', 410],
['13', 400],
['14', 395],
['15', 390],
['16', 388],
['17', 396],
['18', 387],
['19', 385],
['20', 384]
]);
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data, {width: 400, height: 240, legend: 'bottom', title: 'Company Performance', vAxis: {scaleType: 'log'}});
},
packages: ['corechart']
});
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>
here is the same chart, without the option --> vAxis: {scaleType: 'log'}
google.charts.load('current', {
callback: function () {
var data = google.visualization.arrayToDataTable([
['Index', 'Value'],
['1', 100000],
['2', 2170],
['3', 960],
['4', 560],
['5', 520],
['6', 500],
['7', 480],
['8', 460],
['9', 440],
['10', 430],
['11', 420],
['12', 410],
['13', 400],
['14', 395],
['15', 390],
['16', 388],
['17', 396],
['18', 387],
['19', 385],
['20', 384]
]);
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data, {width: 400, height: 240, legend: 'bottom', title: 'Company Performance'});
},
packages: ['corechart']
});
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>
这篇关于Google图表日志规模的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
