我正在使用Reactjs来显示jvectormap-next
的地图。我必须使用jquery因为react-jvectormap停止得到支持我猜。这是我的代码:
import React from "react";
import $ from "jquery";
window.jQuery = $;
require("jvectormap-next")($);
export default class App extends React.Component {
getMap() {
var gdpData = {
AF: 16.63,
AL: 11.58,
DZ: 158.97
// ...
};
$("#world-map-gdp").vectorMap({
map: "world_mill",
series: {
regions: [
{
values: gdpData,
scale: ["#C8EEFF", "#0071A4"],
normalizeFunction: "polynomial"
}
]
},
onRegionTipShow: function(e, el, code) {
el.html(el.html() + " (GDP - " + gdpData[code] + ")");
}
});
}
render() {
return (
<div className="App">
{this.getMap()}
</div>
);
}
}
我得到的错误是Attempt to use map which was not loaded: world_mill
任何人都可以帮忙吗?我需要导入或添加到我的HTML文件中吗?
您需要在索引页正文或头部中包含地图文件(可从jvectormaps网站下载),即:
<script src="/assets/jquery-jvectormap-2.0.3/jquery-jvectormap-2.0.3.min.js"></script>
<script src="/assets/jquery-jvectormap-2.0.3/jquery-jvectormap-world-mill.js"></script>