echart地图设置外边框
时间: 2023-05-08 13:56:25 浏览: 220
要在ECharts地图中设置外边框,可以使用EChart的visualMap组件来实现。使用该组件可以将颜色范围映射到数值范围内,从而显示出地图的不同区域在数值上的差异性。
以下是一个简单的代码示例:
```javascript
option = {
// 其他的图表配置项...
visualMap: {
type: 'piecewise', // 指定visualMap的显示类型
pieces: [
{min: 0, max: 50, label: '0~50', color: '#EAB71F'},
{min: 50, max: 100, label: '50~100', color: '#FCCE10'},
{min: 100, max: 150, label: '100~150', color: '#EE587B'},
{min: 150, max: 200, label: '150~200', color: '#CA236E'},
{min: 200, max: 300, label: '200~300', color: '#831A58'},
{min: 300, label: '>300', color: '#500D35'}
],
outOfRange: {
color: '#999' // 指定超出范围的颜色
},
show: true // 是否显示visualMap,默认为不显示
},
// 其他的图表配置项...
};
```
在该示例中,使用visualMap的type属性设置了该组件的类型为“piecewise”,指定了颜色分段范围及具体颜色,同时还可以通过修改 outOfRange 属性来指定超出分段范围的颜色,最后设置show属性为true,使其显示出来。
通过类似上述的设置,即可在ECharts地图中添加外边框并调整各项颜色属性。
阅读全文