Shulou(Shulou.com)06/01 Report--

Editor to share with you how to use DataGear to make map data visualization Kanban to support the national, provincial and municipal data drilling effect. I hope you will get something after reading this article. Let's discuss it together.

Through the functions of parameterized data set, chart linkage and Kanban API of DataGear, it is convenient to make a data visual Kanban that supports the effect of data drilling.

First, create a parameterized SQL dataset with the superior locale name as a parameter:

SELECT COL_NAME,-- region name COL_VALUE,-- region indicator value COL_PARENT AS COL_MAP-- higher-level region name, as the map name FROM T_ANALYSISWHERE COL_PARENT ='${higher-level region name} 'COL_PARENT =' China'.

Parameters:

The name type must be filled in the superior locale name string.

Example of T_ ANALYSIS table data:

COL_NAME COL_VALUE COL_PARENT Shandong 160China Beijing 200China. Chaoyang District 195 Beijing Haidian District 200 Beijing. Qingdao 10 Shandong Jinan 160 Shandong. Lixia District 50 Jinan Shizhong District 78 Jinan Licheng District 150 Jinan City.

Then, create a new map chart that uses the above dataset:

Chart type: basic map dataset column tag: COL_NAME: region name (name) COL_VALUE: indicator value (value) COL_MAP: map name (map)

Then, create a new visual Kanban and fill in the following Kanban template:

.dg-chart {display: inline-block; width: 100%; height: 480px;} var paramHistory = []; var chartListener = {onUpdate: function (chart, results) {/ / stores the current parent locale name to support the return operation var paramVal = chart.dataSetParamValue (0,0); if (! paramVal) paramHistory = []; else paramHistory.push (paramVal) ("# title") .html ((paramVal? ParamVal: "National") + "- data");}}; $(document) .ready (function () {$("# backButton") .click (function () {/ / get the superior locale name of the previous operation, set it to the chart parameter, and then refresh the chart paramHistory.pop (); var paramVal = (paramHistory.pop () | null); var chart = dashboard.getChart ("chart1") Chart.dataSetParamValue (0, paramVal); chart.refreshData ();});}); DataGear

Example of http://www.datagear.techDataGear Kanban

Return

Click the [Save and Show] button to open the Kanban display page and finish!

Note: in the above example, there is no built-in Jinan map JSON file (jinan.json). You need to add Kanban resources to Kanban through the Kanban editing page.

The effect image is as follows:

After reading this article, I believe you have a certain understanding of "how to use DataGear to make a map data visualization Kanban that supports national, provincial and municipal data drilling effect". If you want to know more about it, welcome to follow the industry information channel. Thank you for your reading!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.