我正在使用PrimeFaces扩展(6.1.0(使用pe:gChart
创建一些图表。
其中一个图表是展示中显示的地理图表。到目前为止没有问题。
我需要渲染的另一个图表是标记地理图表。这在PrimeFaces扩展展示中没有解释,但我希望这将是一项简单的工作。我最终得到了这个模型(我相信这是正确的(:
GChartModelBuilder builder = new GChartModelBuilder();
builder.setChartType(GChartType.GEO);
builder.addOption("displayMode", "markers");
builder.addOption("region", country);
builder.addColumns("City", "Total");
for (...) {
builder.addRow(city, total);
}
当我运行我的项目时,我确实看到了这个图表的地图。区域正确,但不显示标记。不过会生成标记数据。
我的浏览器控制台告诉我:
Google Maps API 錯誤:Missing KeyMapError https://developers.google.com/maps/documentation/javascript/error-messages#missing-key-map-error
有什么方法可以在不创建黑客的情况下设置此 API 密钥?
更新
我创建了一个自定义渲染器:
public class MyGChartsRenderer extends GChartRenderer
{
@Override
protected void encodeMarkup(FacesContext context, GChart chart) throws IOException
{
...
this.startScript(writer, chart.getClientId());
// Appended ?key=xxxxx to the URL (other lines are not modified)
writer.writeAttribute("src", "https://www.google.com/jsapi?key=xxxxx", null);
this.endScript(writer);
}
}
并将其加载到faces-config.xml
中:
<render-kit>
<renderer>
<component-family>org.primefaces.extensions.component</component-family>
<renderer-type>org.primefaces.extensions.component.GChartRenderer</renderer-type>
<renderer-class>MyGChartsRenderer</renderer-class>
</renderer>
</render-kit>
但是谷歌地图API错误一直出现在我的控制台中。
免责声明:我创建了一个答案,不是因为它是答案,而是因为它的信息太多,以至于它不会以任何方式适合评论(嗯;-((
免责声明2:我可能错过了一些东西,并没有真正尝试......希望你不要介意。
注意:三个月前,PrimeFaces扩展根据提交更新为较新的Google图表api版本,并发布了452,即将进行的更改,所以我专注于此!
在PrimeFaces-extensions gchart中.js我注意到
google.charts.load('current', {
packages : [ 'corechart', 'geochart', 'orgchart' ]
});
jQuery(document).ready(function() {
google.charts.setOnLoadCallback(function() {
that.draw();
});
});
在可视化中时:地理图表 | 图表 | 我看到的谷歌开发者
google.charts.load('current', {
'packages':['geochart'],
// Note: you will need to get a mapsApiKey for your project.
// See: https://developers.google.com/chart/interactive/docs/basic_load_libs#load-settings
'mapsApiKey': 'AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY'
});
google.charts.setOnLoadCallback(drawRegionsMap);
与问题提交/修复/问题相关,在PrimeFaces扩展展示源主干中,我还注意到它们明确加载
<script src="https://www.gstatic.com/charts/loader.js"></script>
在 XHTML 中。
许多即将发生的更改,因此最面向未来的解决方案是尝试 6.2-SNAPSHOT 并创建一个真正好的修复程序,您可以在其中创建真正好的修复
程序- 将 mapsApiKey 属性和 getter/setter 添加到 GChart.java
- 将 .attr("mapsApiKey", chart.getMapsApiKey((( 添加到 GChartRenderer.java
- 将
this.mapsApiKey = cfg.mapsApiKey
- 和'mapsApiKey': this.mapsApiKey
添加到 gchart.js 在正确的位置
作为一种解决方法/黑客,我把这个脚本放在我的XHTML中:
<script src="https://maps.googleapis.com/maps/api/js?key=xxxxx&v=3&callback=google.loader.callbacks.maps&sensor=false"></script>