python/Jupyter 中的 Highcharts 地图：无渲染-解网

问：

刚接触 highcharts 时，我正在尝试使用 Jupyter 笔记本为法国的部门绘制分区统计图（作为开始）

from highcharts_maps.chart import Chart
import geopandas as gpd
import numpy as np

df = gpd.read_file('https://raw.githubusercontent.com/gregoiredavid/france-geojson/master/departements-version-simplifiee.geojson')
df['value'] = np.random.randint(0,100,df.shape[0])
my_chart = Chart.from_geopandas(df, property_map = {
                                         'id': 'code',
                                          'name':'nom',
                                         'value': 'value'
                                     }, series_type = 'map')
my_chart.display()

不幸的是，似乎“丢失”了包含在（具有包含 POLYGON 列的 geopandas 数据帧）中包含的几何图形，因为仅包含系列而没有有关几何图形的任何信息。my_chartdfgeometrymy_chart.options

你知道如何让它工作吗（作为一个基本教程，我将寻找更复杂的地图，例如相同数据的瓦片地图）

更新：我还尝试在上一个代码之后添加以下代码：

my_map_data = MapData.from_geojson('https://raw.githubusercontent.com/gregoiredavid/france-geojson/master/departements-version-simplifiee.geojson')
my_chart.set_map_data(my_map_data)

它使某些几何图形更加冗长（但会引发错误）my_chart.optionsmy_chart.options.map_data

HighchartsMapsOptions(chart = {'map': {'topology': {'type': 'Topology', 'objects': {'data': {'geometries': [{'properties': {'code': '01', 'nom': 'Ain'}, 'type': 'Polygon', 'arcs': [[-343, -174, 0, -361, -359, -171, -332]], 'id': 'feature_00'}, {'properties': {'code': '02', 'nom': 'Aisne'}, 'type': 'Polygon', 'arcs': [[-293, 1, -26, -222, -367, -297, -379], [295], [293], [294]], 'id': 'feature_01'}, {'properties': {'code': '03', 'nom': 'Allier'}, 'type': 'Polygon', 'arcs': [[-290, -346, -185, -308, -86, -49]], 'I

请注意，这会引发错误my_chart.display()

Something went wrong with the Highcharts.js script. It should have been automatically loaded, but it did not load for over 5 seconds. Check your internet connection, and then if the problem persists please reach out for support. (You can also check your browser's console log for more details.)

Detailed Error Message:
undefined is not a function (near '...Highcharts.mapChart...')

所以导出功能到PNG文件：HTTPError: 520 Server Error: for url: https://export.highcharts.com/

上次编辑：启用此选项可显示带有颜色的图表。但是尝试将其转换为瓦片图未成功

我添加了这些代码行以正确呈现颜色

color_axis_options = {
    'min': 0,
    'max': 100,
    'minColor': '#e6e9ff',
    'maxColor': '#0022ff' 
}
my_chart.options.color_axis = color_axis_options

现在，我想将这张地图转换为瓦片地图。我以为我必须改变，但没有成功。你有什么想法吗？series_type='tilemap'

谢谢

Python Highcharts 分区统计

“似乎my_chart丢失了 df 中包含的几何形状”似乎与这篇文章的标题不一致？我希望标题意味着代码运行，但没有显示绘图。“丢失几何图形”意味着更多的是数据整理问题。您可能需要更新您的帖子以明确情况是什么？您可以包含在代码中的玩具数据也可能有所帮助。或指向数据。

0赞 Chris Modzelewski 11/8/2023

嗨，@Nicolas - （注意，我是 Highcharts Maps for Python 的创建者，所以希望我能在这方面为您提供帮助！中方能否介绍更多细节？特别是，您使用的是哪个版本的 Highcharts Maps for Python，以及哪个版本的 GeoPandas？您能分享一些关于“丢失 df 中包含的几何图形”是什么意思的更多细节吗？例如，共享的部分输出（这是应从 GeoDataframe 加载几何图形的位置）？my_chart.options.map_data

0赞 Nicolas 11/9/2023

嗨，@ChrisModzelewski，谢谢你的帮助。我正在使用 Highcharts Maps 的 v1.5.0 和 geopandas 的 v0.14.0。当我运行命令 my_chart.options.map_data 时，我收到错误“HighchartsMapsOptions”对象没有属性“map_data”。如果我运行所有选项，我只得到一系列数据 HighchartsMapsOptions（series = [{'data'： {'dataPoints'： [{'value'： 80， 'id'： '01'， 'name'： 'Ain'}， {'value'： 85， 'id'： '02'， 'name'： 'Aisne'}， ...，， 'type'： 'map'}]）

0赞 Chris Modzelewski 11/10/2023

嗨@Nicolas - 感谢您提供所有详细信息，并包含 GeoJSON。这非常有帮助，希望能让我重新创建错误。目前，我已经在这里的 Github 存储库中代表您提交了错误报告，希望我能够诊断出正在发生的事情。我将回顾我在GH问题上的发现，以及这里的答案。

0赞 Chris Modzelewski 11/10/2023

嗨，@Nicolas - 另外，确认了这个问题：似乎由于某种原因，必须引入了一个错误，该错误阻止了地图拓扑（在 - 抱歉，我在之前的评论中有一个错别字）正确地序列化为 JS 文字。这绝对是一个错误，将在 v.1.5.1 中修复。在我们说话的时候，我正在努力解决这个问题。my_chart.options.chart.map_data

答：

1赞 Chris Modzelewski 11/10/2023 #1

好的，正如评论中提到的，这原来是 Highcharts Maps for Python v.1.5.0 中的一个错误，现在已经从 v.1.5.1 开始解决。通过此 bug 修复，您的代码将成功加载地图拓扑并呈现地图。

但是，在测试错误修复时，我确实注意到上面代码中的一件小事：您没有设置 series 属性，如 API 参考文档中所述，这意味着它默认为 ..join_by'hc-key'

由于拓扑/几何没有相应的字段，因此要渲染的数据点最终不会连接到地图几何，因此无法正确渲染。在您提供的代码中，通过设置 to 的值（using ，这很容易解决，这会导致数据点按顺序连接。当然，您也可以指定地图数据中存在的字段。'hc-key'.join_bynullhighcharts_maps.constants.EnforcedNull.join_by

以下是包含该小调整的代码：

from highcharts_maps.chart import Chart
from highcharts_maps import constants
import geopandas as gpd
import numpy as np

df = gpd.read_file('https://raw.githubusercontent.com/gregoiredavid/france-geojson/master/departements-version-simplifiee.geojson')
df['value'] = np.random.randint(0,100,df.shape[0])
my_chart = Chart.from_geopandas(df, property_map = {
                                         'id': 'code',
                                          'name':'nom',
                                         'value': 'value'
                                     }, series_type = 'map')

my_chart.options.series[0].join_by = constants.EnforcedNull
my_chart.display()

这将呈现如下图表（鼠标悬停在一个区域上）：

显然，您可以进一步配置鼠标悬停在其中一个数据点上时显示的工具提示和信息。

希望这会有所帮助，并感谢您提出问题并帮助我们发现此错误！

非常感谢@Chris。尽管如此，我仍然在Jupyter Notebook中遇到错误（但在渲染地图的Jupyter Lab中没有）：Highcharts.js脚本出了点问题。它应该是自动加载的，但它没有加载超过 5 秒。检查您的互联网连接，如果问题仍然存在，请联系支持。（您还可以查看浏览器的控制台日志以获取更多详细信息。详细错误消息：undefined 不是函数（靠近“...Highcharts.mapChart...'）。我在 Safari for Mac 上使用最新版本的 Anaconda 和软件包。

0赞 Chris Modzelewski 11/11/2023

这是一个不同的问题，我们在 Jupyter Notebook 中看到过这个问题，并且难以一致地重现。您使用的是哪个版本的 JN？您是在浏览器中还是在 VSCode 中运行 Notebook？如果在VSCode中，您是否正在使用任何JN相关的扩展？如果是这样，请禁用这些扩展，然后重新启用它们。许多用户报告说，这样做会使他们的笔记本突然在 VSCode 中正确呈现（请参阅此处）。我建议在我们的 GH 存储库中提交问题 - 我们也可以进行其他诊断。

0赞 Nicolas 11/11/2023

非常感谢@Chris。我将填补一个问题，但现在可以使用 Jupyter 实验室。您知道如何更改色阶并查看分区统计图（在“值”列之后）吗？我对如何修改图表的参数有点迷茫（在 Python 中，我可以看到我不太熟悉的 Javascript 示例）。谢谢

上一个：在 R 中联接不完全匹配的表。仅当整个单词匹配时才匹配

下一个：剧情：add_annotation的奇怪行为

python/Jupyter 中的 Highcharts 地图：无渲染

Highcharts map in python/Jupyter : no rendering

评论

评论