0

我正在使用 Google Geochart API 为印度政治地图实施州级报告。我使用了以下代码:

google.load('visualization', '1', {'packages': ['geochart']});
google.setOnLoadCallback(drawVisualization);

function drawVisualization() {

var data = new google.visualization.DataTable();

data.addColumn('string', 'Country');
data.addColumn('number', 'Value'); 
data.addColumn({type:'string', role:'tooltip'});
var ivalue = new Array();

data.addRows([[{v:'IN-AP',f:'Andhra Pradesh'}, 5,'5']]);
ivalue['IN-AP'] = 'http://en.wikipedia.org/wiki/Andhra_Pradesh';

data.addRows([[{v:'IN-AR',f:'Arunachal Pradesh'},4,'4']]);
ivalue['IN-AR'] = 'http://en.wikipedia.org/wiki/Arunachal_Pradesh';

data.addRows([[{v:'IN-AS',f:'Assam'},2,'2']]);
ivalue['IN-AS'] = 'http://en.wikipedia.org/wiki/Assam';

data.addRows([[{v:'IN-BR',f:'Bihar'},3,'3']]);
ivalue['IN-BR'] = 'http://en.wikipedia.org/wiki/Bihar';

data.addRows([[{v:'IN-CT',f:'Chhattisgarh'},4,'4']]);
ivalue['IN-CT'] = 'http://en.wikipedia.org/wiki/Chhattisgarh';

data.addRows([[{v:'IN-GA',f:'Goa'},5,'5']]);
ivalue['IN-GA'] = 'http://en.wikipedia.org/wiki/Goa';

data.addRows([[{v:'IN-GJ',f:'Gujarat'},6,'6']]);
ivalue['IN-GJ'] = 'http://en.wikipedia.org/wiki/Gujarat';

data.addRows([[{v:'IN-HR',f:'Haryana'},7,'7']]);
ivalue['IN-HR'] = 'http://en.wikipedia.org/wiki/Haryana';

data.addRows([[{v:'IN-HP',f:'Himachal Pradesh'},7,'3']]);
ivalue['IN-HP'] = 'http://en.wikipedia.org/wiki/Himachal_Pradesh';

data.addRows([[{v:'IN-JK',f:'Jammu and Kashmir'},3,'3']]);
ivalue['IN-JK'] = 'http://en.wikipedia.org/wiki/Jammu_and_Kashmir';

data.addRows([[{v:'IN-JH',f:'Jharkhand'},4,'4']]);
ivalue['IN-JH'] = 'http://en.wikipedia.org/wiki/Jharkhand';

data.addRows([[{v:'IN-KA',f:'Karnataka'},8,'8']]);
ivalue['IN-KA'] = 'http://en.wikipedia.org/wiki/Karnataka';

data.addRows([[{v:'IN-KL',f:'Kerala'},7,'7']]);
ivalue['IN-KL'] = 'http://en.wikipedia.org/wiki/Kerala';

data.addRows([[{v:'IN-MP',f:'Madhya Pradesh'},8,'8']]);
ivalue['IN-MP'] = 'http://en.wikipedia.org/wiki/Madhya_Pradesh';

data.addRows([[{v:'IN-MH',f:'Maharashtra'},9,'9']]);
ivalue['IN-MH'] = 'http://en.wikipedia.org/wiki/Maharashtra';

data.addRows([[{v:'IN-MN',f:'Manipur'},7,'7']]);
ivalue['IN-MN'] = 'http://en.wikipedia.org/wiki/Manipur';

data.addRows([[{v:'IN-ML',f:'Meghalaya'},4,'4']]);
ivalue['IN-ML'] = 'http://en.wikipedia.org/wiki/Meghalaya';

data.addRows([[{v:'IN-MZ',f:'Mizoram'},3,'3']]);
ivalue['IN-MZ'] = 'http://en.wikipedia.org/wiki/Mizoram';

data.addRows([[{v:'IN-NL',f:'Nagaland'},2,'2']]);
ivalue['IN-NL'] = 'http://en.wikipedia.org/wiki/Nagaland';

data.addRows([[{v:'IN-OR',f:'Orissa'},4,'4']]);
ivalue['IN-OR'] = 'http://en.wikipedia.org/wiki/Orissa';

data.addRows([[{v:'IN-PB',f:'Punjab'},5,'5']]);
ivalue['IN-PB'] = 'http://en.wikipedia.org/wiki/Punjab';

data.addRows([[{v:'IN-RJ',f:'Rajasthan'},7,'7']]);
ivalue['IN-RJ'] = 'http://en.wikipedia.org/wiki/Rajasthan';

data.addRows([[{v:'IN-SK',f:'Sikkim'},4,'4']]);
ivalue['IN-SK'] = 'http://en.wikipedia.org/wiki/Sikkim';

data.addRows([[{v:'IN-TN',f:'Tamil Nadu'},8,'8']]);
ivalue['IN-TN'] = 'http://en.wikipedia.org/wiki/Tamil_Nadu';

data.addRows([[{v:'IN-TR',f:'Tripura'},3,'3']]);
ivalue['IN-TR'] = 'http://en.wikipedia.org/wiki/Tripura';

data.addRows([[{v:'IN-UT',f:'Uttarakhand'},4,'4']]);
ivalue['IN-UT'] = 'http://en.wikipedia.org/wiki/Uttarakhand';

data.addRows([[{v:'IN-UP',f:'Uttar Pradesh'},8,'8']]);
ivalue['IN-UP'] = 'http://en.wikipedia.org/wiki/Uttar_Pradesh';

data.addRows([[{v:'IN-WB',f:'West Bengal'},7,'7']]);
ivalue['IN-WB'] = 'http://en.wikipedia.org/wiki/West_Bengal';

data.addRows([[{v:'IN-AN',f:'Andaman and Nicobar Islands'},2,'2']]);
ivalue['IN-AN'] = 'http://en.wikipedia.org/wiki/Andaman_and_Nicobar_Islands';

data.addRows([[{v:'IN-CH',f:'Chandigarh'},6,'6']]);
ivalue['IN-CH'] = 'http://en.wikipedia.org/wiki/Chandigarh';

data.addRows([[{v:'IN-DN',f:'Dadra and Nagar Haveli'},4,'4']]);
ivalue['IN-DN'] = 'http://en.wikipedia.org/wiki/Dadra_and_Nagar_Haveli';

data.addRows([[{v:'IN-DD',f:'Daman and Diu'},2,'2']]);
ivalue['IN-DD'] = 'http://en.wikipedia.org/wiki/Daman_and_Diu';

data.addRows([[{v:'IN-DL',f:'Delhi'},10,'10']]);
ivalue['IN-DL'] = 'http://en.wikipedia.org/wiki/Delhi';

data.addRows([[{v:'IN-LD',f:'Lakshadweep'},1,'1']]);
ivalue['IN-LD'] = 'http://en.wikipedia.org/wiki/Lakshadweep';

data.addRows([[{v:'IN-PY',f:'Puducherry (Pondicherry)'},6,'6']]);
ivalue['IN-PY'] = 'http://en.wikipedia.org/wiki/Puducherry';

var options = {
backgroundColor: {fill:'#FFFFFF',stroke:'#FFFFFF' ,strokeWidth:0 },
colorAxis: {colors: ['yellow','orange', 'red']},
backgroundColor: {fill:'#FFFFFF',stroke:'#FFFFFF' ,strokeWidth:0 }, 
datalessRegionColor: '#FFFFFF',
displayMode: 'regions', 
enableRegionInteractivity: 'true', 
resolution: 'provinces',
sizeAxis: {minValue: 1, maxValue:1,minSize:10,  maxSize: 10},
region:'IN',
keepAspectRatio: true,
width:800,
height:500,
tooltip: {textStyle: {color: '#444444'}, trigger:'focus'}
};

var chart = new google.visualization.GeoChart(document.getElementById('visualization')); 
google.visualization.events.addListener(chart, 'select', function() {
var selection = chart.getSelection();
if (selection.length == 1) {
var selectedRow = selection[0].row;
var selectedRegion = data.getValue(selectedRow, 0);
if(ivalue[selectedRegion] != '') { window.open(ivalue[selectedRegion]);  }
}
});
chart.draw(data, options);
}

在此,最高的状态即。查谟和克什米尔存在争议。有什么方法可以实现以下任何一项:
1. 我可以删除有争议的区域并以适当的颜色显示整个状态。
2. 或者任何方式,显示有争议的国家对于有争议的和无争议的区域具有相同的颜色。

我们还可以在“分辨率:'省'”选项中拥有多个“区域”吗?

请帮忙!!

4

3 回答 3

4

我正在寻找解决方案,发现我们可以在域选项中将参数传递为“IN”,这会将克什米尔视为印度州而不是列为有争议的州,请检查以下链接中的所有选项

https://google-developers.appspot.com/chart/interactive/docs/gallery/geochart

于 2015-02-11T07:25:56.167 回答
0

不是一个完整的答案,我承认我对 google.maps 的这方面了解不多,但它在这里说:

Maps API 中地图类型的内部工作原理是一个高级主题。大多数开发人员可以简单地使用下面提到的基本地图类型。但是,您也可以使用自定义地图类型定义自己的地图图块,或使用样式化地图修改现有地图类型的表示。提供自定义地图类型时,您需要了解如何修改地图的地图类型注册表。

通过一些努力,这应该提供一种机制,您可以通过该机制为有争议的地区提供自己重新着色的地图图块。

于 2013-07-12T01:03:19.330 回答
0

该地图的基础 SVG 将领土显示为有争议的领土,如果不编辑 SVG 本身,您将无法更改它们。以下是巴基斯坦查谟和克什米尔的相关线路:

<path d="M309.80792933629334,18.989110296063618L312.62808795206297,22.726320565659634L318.8362126083018,25.16463114909045L322.88492641920095,24.446213181078875L321.8625826161618,21.835482285325142L316.19903029818965,21.424547207622577L313.5211865868203,19.382803342533922L312.8444646944677,15.12689530003403L305.6009264990715,11.194275343138958L300.6533052818071,6.069081559344707L302.39738895716204,12.655537490074323L300.87113421711376,15.882671002382095L302.96229199605716,16.411426626838498L303.9512353623492,19.871327560781815L309.88634775300363,18.911521155518564Z" stroke="none" stroke-width="0" fill="url(#_ABSTRACT_RENDERER_ID_0)">
<path d="M352.86980546060823,44.62370023065002L352.8785186180206,43.459863122471255L356.59758464015573,43.43831058343074L357.38612538596567,40.084735508753326L360.68986423811594,39.4554013687749L363.73656494660463,28.12020266948963L365.6955731714622,26.554051499224865L364.9070324256523,25.10715771164957L362.56754966045906,24.223503610995472L360.38199934288275,26.901765795742225L359.568771317738,23.74216357242775L355.29061102831594,23.094150565281495L353.37081201181365,18.535070140280627L352.16258751731283,19.37418...61059265807575,30.294135440692685L333.46705609639645,34.82016863916499L334.505374021358,40.82757968767728L345.62626726521205,45.57488562029698L343.98383709300026,49.103754679169384L340.0876035368157,50.47449616213537L342.8090130352466,61.802510681740465L344.1900484850904,62.31258743902904L343.71808579192606,58.345483419669286L346.3828597671772,58.19461564638694L343.6483805326281,51.75471698113179L350.9195103931631,51.74178545770757L353.8834361062351,47.64823987597818L352.81897870903674,44.681173668090736Z" stroke="none" stroke-width="0" fill="url(#_ABSTRACT_RENDERER_ID_0)">

两条路径分别用于西北和东部(两个不同的形状)。

以下是印度查谟和克什米尔的相关线路:

<path d="M349.0708688288608,76.60192082277737L351.06472968336755,77.21401293152348L353.21397517839284,73.89923242711829L349.8768358894954,68.99962188527996L351.03713801822863,65.88599841191811L346.62247159601435,65.58713653722538L342.6797678669645,61.687563806858705L340.9632758567483,58.30668884939667L341.3205153106512,51.78201686391614L340.04839432846063,51.111014481793575L345.84409620051866,46.20709343214726L340.8471004245848,42.639429803001754L334.505374021358,40.82757968767728L333.46705609639645,34.82016863916...24963L294.35369247273957,81.03599652134461L300.39191055943917,75.65648277687451L298.7596457375414,70.17351684501048L300.878395181624,70.74106703973978L309.4463333036843,65.00952849094406L321.2439484398911,71.4250009452865L326.4979823594866,68.71656520588343L330.6817501102758,75.89930805006198L335.88640947120206,73.01557832646392L334.9221533842447,78.0991038681132L341.2798539093941,74.2167731689795L341.8592788773095,77.91375203236635L344.60247126927095,80.35206261579755L349.0563468998405,76.64646273679408Z" stroke="none" stroke-width="0" fill="url(#_ABSTRACT_RENDERER_ID_4)">

这是阿鲁纳恰尔和邦的路径:

基本上,这些形状被赋予“有争议的领土”填充。要完全消除该填充,您可以编辑 SVG 以删除具有该填充的上述路径,或者您可以删除这些填充的定义。删除形状可能是更合适的方法,但删除定义更快更容易(因为它们位于顶部,如果您以后确实想更改某些内容,则可以更早地找到并删除)。以下是定义:

  • ID_0 控制巴基斯坦的灰线
  • ID_1 控制印度(阿鲁纳恰尔邦和邦)的灰线
  • ID_3 控制印度的灰线(查谟和克什米尔)

您可以使用 jquery 等搜索 id,然后将其删除。这是地图最初的样子:

默认地图

如果您删除 ID 1 和 3,这就是地图的样子(保持巴基斯坦克什米尔有争议的部分为灰色):

大印度

如果您删除 ID 0、1 和 3(删除所有标记有争议领土的对角线),这就是地图的样子:

无可争议的印度

关键是,您必须编辑 SVG。

免责声明:以上内容仅作为示例说明如何在技术上实现预期结果,而无需在上述情况或其他情况下对有争议的领土采取任何立场。这是技术帮助,不代表任何政治观点。

于 2013-07-12T01:40:08.737 回答