1

尝试从 Datamaps 在地图上绘制弧线时，如下所示：https ://datamaps.github.io/

我得到一个空弧，使用以下代码并在此处显示：http: //jsfiddle.net/yausern/qbgewhss/1/

var map = new Datamap(
    {
        element: document.getElementById('container'),
        fills: {
            defaultFill: "#ABDDA4",
            win: '#0fa0fa'
        },
        data: {
            'CHN': { fillKey: 'win' },
            'SWE': { fillKey: 'win' },

        }
    }
);
map.arc(
    [
        {
            origin: 'CHN',
            destination: 'SWE',
            options: {
                strokeWidth: 2,
                strokeColor: 'rgba(100, 10, 200, 0.4)',
                greatArc: true
            }

        }
    ],
    {
        strokeWidth: 1, arcSharpness: 1.4
    }

)

我在这里想念什么？

4

2 回答 2

1

它在使用此处找到的高分辨率版本时有效：https ://raw.githubusercontent.com/markmarkoh/datamaps/master/dist/datamaps.world.hires.min.js

我没有让它在 JSFiddle 中工作，但在控制台中收到以下错误消息：

Refused to execute script from 'https://raw.githubusercontent.com/markmarkoh/datamaps/master/dist/datamaps.world.hires.min.js' because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled.

当我下载脚本并在本地引用它时，它在使用 Python 3 的 http.server 时有效

于 2016-06-15T06:12:57.957 回答
0

根据 API，似乎 arcs 插件接受国家名称。我尝试了几件事，从使用scope:'world'到引用插件，但没有成功。

无论如何，这听起来可能不是您的解决方案，但您始终可以使用纬度和经度：

{
  origin: {
      latitude: 60.1282,
      longitude: 18.6435
  },
  destination: {
      latitude: 35.8617,
      longitude: 104.1954
}

这是小提琴：http: //jsfiddle.net/gerardofurtado/59seachL/

于 2016-06-14T13:38:28.023 回答