文章/答案/技术大牛

发布

社区首页 >问答首页 >如何利用qgis生成的自定义地图json实现高地图中的映射？

问如何利用qgis生成的自定义地图json实现高地图中的映射？
EN

Stack Overflow用户

提问于 2019-02-07 12:03:18

回答 1查看 172关注 0票数 0

我需要用高地图实现地图泡。我已经生成了一个自定义geojson文件使用qgis的地图。

我参考了这的例子，但我没有在地图上得到气泡。即使我在控制台中也没有任何错误，除了以下内容：

[Violation] Added non-passive event listener to a scroll-blocking 'mousewheel' event. Consider marking event handler as 'passive' to make the page more responsive. See https://www.chromestatus.com/feature/5745543795965952

Index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Custom Highmap</title>
</head>
<body>
<div id="container" style="height: 500px; min-width: 350px; max-width: 800px; margin: 0 auto;"></div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.6/proj4.js"></script>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/maps/highmaps.js"></script>
<script src="https://code.highcharts.com/maps/modules/exporting.js"></script>
<script src="https://code.highcharts.com/maps/modules/offline-exporting.js"></script>

<script src='./data/custom-world.js'></script>

<script>
$.getJSON('./data/data.json', function (data) {


        Highcharts.mapChart('container', {
            chart: {
                borderWidth: 1,
                map: 'custom/world'
            },

            title: {
                text: 'World population 2013 by country'
            },

            subtitle: {
                text: 'Demo of Highcharts map with bubbles'
            },

            legend: {
                enabled: false
            },

            mapNavigation: {
                enabled: true,
                buttonOptions: {
                    verticalAlign: 'bottom'
                }
            },

            series: [{
                name: 'Countries',
                color: '#E0E0E0',
                enableMouseTracking: false
            }, {
                type: 'mapbubble',
                name: 'Population 2016',
                joinBy: ['ISO_A2', 'name'],
                data: data,
                minSize: 4,
                maxSize: '12%',
                tooltip: {
                    pointFormat: '{point.deposited}: [BTC]'
                }
            }]
        });
    });

</script>
</body>
</html>

data.json

[
  {
    "name" : "GB",
    "deposited" : "5"
  },
  {
    "name" : "RU",
    "deposited" : "10"
  },
  {
  "name" : "CH",
  "deposited" : "3"
  },
  {
    "name" : "IN",
    "deposited" : "50"
  }
]

custom-world.js

请从这里下载此文件

现在的问题是，我得到的是自定义地图，但不是地图泡泡。

任何帮助都将不胜感激，因为这些高图表/地图对我来说有点混乱。

javascript

html

highcharts

qgis

回答 1

Stack Overflow用户

回答已采纳

发布于 2019-02-08 11:26:37

密码看上去很好。但是，这个问题似乎与您的data.json文件有关。你不能定义气泡的大小(z -属性)。检查文档：https://api.highcharts.com/highmaps/series.mapbubble.data.z。这就是为什么泡沫是看不见的。

示例data.json:

[
  {
    "name" : "GB",
    "deposited" : "5",
    "z": 1000
  },
  {
    "name" : "RU",
    "deposited" : "10",
    "z": 1350
  }
  ...
]

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/54572931

复制

相似问题

问如何利用qgis生成的自定义地图json实现高地图中的映射？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何利用qgis生成的自定义地图json实现高地图中的映射？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何利用qgis生成的自定义地图json实现高地图中的映射？
EN