在日常使用地圖過程中，通常會遇到地圖示籤，提示點等顯示不滿足我們的需求，需要進行JavaScript程式碼編寫。

例如：在使用地圖過程中，會發現很多地名顯示的位置偏離。這時候就需要使用JavaScript進行調控。以黑龍江和內蒙古為例，來介紹下如何在FineReport中利用JavaScript自定義地圖示籤。

新建地圖

以區域地圖為例，新建表單，拖入地圖（新特性）元件，地圖邊界選擇區域地圖下的中國（省級）：

資料準備

新建工作簿，新增資料集ds1，SELECT*FROM地圖1，選中圖表，選擇圖表屬性表-資料，如下圖所示：

選擇圖表屬性表-樣式>系列，如下圖設定，邊框設為藍色：

自定義JS顯示標籤

選擇圖表屬性表-樣式>標籤，內容選擇自定義，JS如下：

點選(此處)摺疊或開啟

function(){ var points = this.points;
var total = '
';
if(this.name=="內蒙古自治區")
{total += '
<span style="font-size:25px;color:'+FR.contentFormat(points[1].value, '')+'">' +FR.contentFormat(points[2].value, '#0.00')+''+this.name+'
';}
else if(this.name=="黑龍江省")
{total += '
<span style="font-size:25px;color:'+FR.contentFormat(points[1].value, '')+'">'+ FR.contentFormat(points[2].value, '#0.00')+''+this.name+'
';}
else{total += '
<span style="font-size:25px;color:'+FR.contentFormat(points[1].value, '')+'">'+FR.contentFormat(points[2].value, '#0.00')+''+this.name+'
';}
for(var i = 0, len = points.length-2; i < len; i++)
{total += ('
'+FR.contentFormat(points[i].value, '#0.00')+'
');}
total+='

'; return total;}

div align=center style="margin-top當讀取名字為內蒙古自治區時候，我們進行margin顯示位置的調整，使其不顯示偏離

FR.contentFormat(value, '#.##%')進行數值格式自定義，後面的'#.##%'可以根據實際需求進行更改；

this.points這個引數在地圖中使用時表示同一個區域上的不同的系列的點

自定義JS顯示提示點

選擇圖表屬性表-樣式>提示，內容選擇自定義，JS如下：

點選(此處)摺疊或開啟

function(){var points = this.points ;
var total = '
';
total +='
'+this.name+'
';
for(var i = 0, len = points.length-1; i < len; i++)
{total +='
●'+points[i].seriesName+':'+FR.contentFormat(points[i].value, '')+'
';}
return total;}

此處做一個簡單的迴圈，迴圈展示我們前端設定的引數，並對引數做單獨的處理，包括控制字型大小，以及顯示格式。

儲存與預覽

調整後效果如下，標籤位置正確，提示採用了自定義格式：

FineReport中如何用JavaScript自定義地圖示籤

相關文章