【问题标题】:Hide US on google geochart when region is set to Canada当地区设置为加拿大时在谷歌地理图表上隐藏美国
【发布时间】:2013-06-02 22:33:07
【问题描述】:

当地区设置为加拿大时,我需要在地理图表上隐藏美国:

google.load('可视化', '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:'CA-BC',f:'CA-BC'},0,'Test']]);

 var options = {
 backgroundColor: {fill:'#FFFFFF',stroke:'#FFFFFF' ,strokeWidth:0 },
 colorAxis:  {minValue: 0, maxValue: 0,  colors: ['#0000ff',]},
 legend: 'none',    
 backgroundColor: {fill:'#FFFFFF',stroke:'#FFFFFF' ,strokeWidth:0 },    
 datalessRegionColor: '#f5f5f5',
 displayMode: 'markers', 
 enableRegionInteractivity: 'true', 
 resolution: 'provinces',
 region:'CA',
 keepAspectRatio: true,
 width:700,
 height:500,
 tooltip: {textStyle: {color: '#444444'}, trigger:'focus'}    
 };
  var chart = new google.visualization.GeoChart(document.getElementById('visualization')); 
 chart.draw(data, options);
 }

http://jsfiddle.net/jk171505/VJtBR/

【问题讨论】:

    标签: region regions google-visualization


    【解决方案1】:

    使用 API 选项,您无法真正做到。 您可以使用高级 CSS 选择器来隐藏 SVG 形状。

    添加此 CSS,它将隐藏美国形状:

    #visualization path:nth-child(237), #visualization path:nth-child(236) {
        display:none;    
    } 
    

    http://jsfiddle.net/cmoreira/mMadX

    我已经建立了一个页面,其中包含一些关于如何将这个和其他 CSS 技术与 Google Geochart API 一起使用的信息。如果有帮助,请点击以下链接:http://cmoreira.net/interactive-world-maps-demo/advanced-customization/

    【讨论】:

    • 我做了类似的事情,但使用的是 jquery。
    猜你喜欢
    • 1970-01-01
    • 2017-08-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多