ECharts,作为一款开源的JavaScript可视化库,以其丰富的图表类型和强大的交互功能,赢得了广大开发者的喜爱。其中,ECharts的3D地图功能,更是让数据可视化达到了一个新的高度。本文将重点介绍ECharts的map3D材质系统,让你轻松掌握如何为3D地图添加丰富的材质效果。 一、map3D材质系统简介 在ECharts的3D地图中,材质系统决定...
const viewControl = { center: [-10, 0, 13], }; const mapSerie = { type: 'map3D', map: '福建省', show: true, boxWidth: 200, boxHeight: 0, regionHeight: 6, aspectScale: 0.9, shading: 'lambert', itemStyle: { color: "#1CA7FC", opacity: 0.9, borderWidth: 2, }, emphasis: ...
213)",),map3d_label=opts.Map3DLabelOpts(is_show=False,formatter=JsCode("function(data){return d...
{ type: "map3D", map: "map", top: "-12", left: "-2", itemStyle: { opacity: 0, //设置opacity透明度为0 borderWidth: 0 }, regionHeight: 8, viewControl: { distance: 150, // 地图视角 控制初始大小 // rotateSensitivity: 0, // 旋转 // zoomSensitivity: 0, // 缩放 // autoRotate...
使用Apache ECharts和echarts-gl实现立体3维地图,且地图区块上有两立体柱展示地区数据,点击区块可获取对应series的data,可选中高亮。使用了geo3d,map3d,bar3d等3d组件。能更加立体美观的的展示多个维度的数据。
type: 'map3D', name: '地图', selectedMode: 'single', // 地图高亮单选 regionHeight: 4, // 地图高度 map: 'myMap', viewControl: { distance: 98, // 地图视角 控制初始大小 alpha: 50,// 倾斜角度 rotateSensitivity: [1, 1] },
echats map3d 径向itemstyle渐变填充 echarts地图渐变色 前言: 用过echarts的朋友们应该都知道,里边的一般都是单色的,但是如果UI把它设计成了渐变色,前端该怎么处理呢? 法一:echarts.graphic.LinearGradient echarts内置的渐变色生成器echarts.graphic.LinearGradient可以用来设置渐变色,那该怎么写吗?下面是一个线性渐变...
1. 2. 3. 4. js读取后端发来的json数据,js代码(这个放在html的开头): setInterval(function () { PieChart(); }, 1000);//每隔1秒执行每次刷新数据的函数 $(function () { PieChartFirst(); }) //这个是预加载 把饼图的框架加载出来 function PieChartFirst() { ...
type:'map3D', map:'绍兴',//必须和上面注册的地图名称一致,详细可以看ECharts的GL配置说明boxDepth: 100,//地图倾斜度regionHeight: 2,//地图厚度light: { main: { intensity:1.5} }, label: { show:true,//是否显示市textStyle: { color:"#333333",//文字颜色fontSize: 16,//文字大小fontFamily: ...
processingData() }, beforeDestroy() {}, methods: { // 初始化地图 initMap() { this.chartMap = this.$echarts.init(document.getElementById('Map3D')) // this.$echarts.registerMap('liaoNing', liaoNingJson) this.$echarts.registerMap('liaoNing', { geoJSON: liaoNingJson }) console.log('...