我正在尝试设置美国各州的地图,我已放入 jVectorMap 但无论我做什么都无法改变颜色。
我试图在 jsfiddle 中实现我的问题,但它不想在那里做任何事情。在我的电脑上生成了一张地图,但颜色不会改变。
我正在使用的插件:http: //jvectormap.com/
任何人都知道为什么我不能改变状态颜色?
或者,如果有更易于使用的地图,我也会接受该建议。我基本上只想在我的页面上有一个可点击的地图,带有颜色和悬停效果。
编辑现在尝试不同的地图库,完成后将发布结果
我正在尝试设置美国各州的地图,我已放入 jVectorMap 但无论我做什么都无法改变颜色。
我试图在 jsfiddle 中实现我的问题,但它不想在那里做任何事情。在我的电脑上生成了一张地图,但颜色不会改变。
我正在使用的插件:http: //jvectormap.com/
任何人都知道为什么我不能改变状态颜色?
或者,如果有更易于使用的地图,我也会接受该建议。我基本上只想在我的页面上有一个可点击的地图,带有颜色和悬停效果。
编辑现在尝试不同的地图库,完成后将发布结果
也许重新考虑使用 jvectormap 回去?如果我正确理解您的目标,jvectormap 应该可以正常工作。
在 jvectormap 站点上,正在使用 1.0 版本。
http://jvectormap.com/examples/world-gdp/
http://jvectormap.com/js/jquery-jvectormap-1.0.min.js https://raw.github.com/bjornd/jvectormap/master/jquery -jvectormap.js(最新版本)
http://jvectormap.com/js/jquery-jvectormap-us-aea-en.js
看来您的小提琴链接到 github 网页而不是真正的 js 文件。此外,无需在小提琴的 javascript 部分添加标签。http://doc.jsfiddle.net/basic/introduction.html#javascript
尝试查看一些站点示例的源代码,并检查 1.0 api 的 WorldMap 部分:http: //jvectormap.com/documentation/javascript-api-v1/jvm-worldmap/
工作示例
这是您的小提琴的一个分支,它似乎满足您对颜色和点击事件的要求:http:
//jsfiddle.net/bQ78b/1/
$(function() {
$('#usMap').vectorMap({
map: 'us_aea_en',
hoverColor: false,
hoverOpacity: 0.5,
onRegionClick: function(e, code){
alert( code.replace("US-", "") );
},
regionStyle: {
initial: {
fill: '#128da7'
},
hover: {
fill: "#A0D1DC"
}
}
});
});
希望这可以帮助...
最终选择了这个选项:http: //newsignature.github.com/us-map/
如果您有要覆盖的数据,jVector 地图看起来不错,但我只是希望每个州都链接到网站上的其他地方。