<!DOCTYPE html>
<html>
<head>
<script data-require="jquery@2.1.4" data-semver="2.1.4" src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="//public.tableau.com/javascripts/api/tableau-2.0.1.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<h1>Tableau JavaScript API Sample</h1>
<div data-js="tableau-root" style="display: block;"></div>
</body>
</html>
(function(){
/**
* Viz オブジェクト
* @property viz
* @type {Object}
*/
var viz;
/**
* WorkBook オブジェクト
* @property workbook
* @type {Object}
*/
var workbook;
/**
* アクティブな Sheet オブジェクト
* @property activeSheet
* @type {Object}
*/
var activeSheet;
/**
* Viz クラスの初期化処理
* @method initializeViz
*/
var initializeViz = function () {
var $body = $('body');
var placeholderDiv = $body.find('[data-js=tableau-root]')[0];
var $tbody = $body.find('[data-js=fields-info]');
var url = 'http://public.tableau.com/views/cm-awsmembers-blogposts/sheet0';
var options = {
'hideTabs' : true,
'hideToolbar' : true,
'onFirstInteractive' : function () {
workbook = viz.getWorkbook();
activeSheet = workbook.getActiveSheet();
var onSuccess = function(filters) {
$.each(filters, function(i, filter) {
var fieldName = filter.getFieldName();
var filterType = filter.getFilterType();
if(filterType === tableau.FilterType.CATEGORICAL) {
var applyFilterValues = [];
var dataValues = filter.getAppliedValues();
$.each(dataValues, function(j, dataValue) {
if(typeof dataValue.value === 'string') {
var data = dataValue.value;
if(data.match(/[a-z]/)) {
applyFilterValues.push(data);
}
}
});
activeSheet.applyFilterAsync(fieldName, applyFilterValues, tableau.FilterUpdateType.REPLACE);
} else if(filterType === tableau.FilterType.QUANTITATIVE) {
//TODO:
} else if(filterType === tableau.FilterType.HIERARCHICAL) {
//TODO:
} else if(filterType === tableau.FilterType.RELATIVEDATE) {
//TODO:
}
});
};
var onFault = function(error) {
//TODO:
};
activeSheet
.getFiltersAsync()
.then(onSuccess, onFault);
}
};
viz = new tableau.Viz(placeholderDiv, url, options);
};
$(initializeViz);
}());
/* Styles go here */