Echarts图标自适应问题(已解决)

<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>ECharts</title><!-- 引入 echarts.js --><script src="js/echarts.common.min.js"></script>
</head>
<body><!-- 为ECharts准备一个具备大小（宽高）的Dom --><div id="main" style="width: 600px;height:400px;"></div><script type="text/javascript">var worldMapContainer = document.getElementById('main');//用于使chart自适应高度和宽度,通过窗体高宽计算容器高宽
var resizeWorldMapContainer = function () {worldMapContainer.style.width = window.innerWidth+'px';worldMapContainer.style.height = window.innerHeight+'px';
};
//设置容器高宽
resizeWorldMapContainer();
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(worldMapContainer);// 指定图表的配置项和数据var option = {title: {text: 'ECharts 入门示例'},tooltip: {},legend: {data:['销量']},xAxis: {data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]},yAxis: {},series: [{name: '销量',type: 'bar',data: [5, 20, 36, 10, 10, 20]}]};// 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);//用于使chart自适应高度和宽度
        window.onresize = function () {//重置容器高宽
            resizeWorldMapContainer();myChart.resize();};</script>
</body>
</html>

呵呵终于解决了这个问题,官方都没有写明白。。

转载于:https://www.cnblogs.com/ZaraNet/p/9571069.html

Echarts图标自适应问题(已解决)相关推荐

springboot+bootstrap在显示页面时图标失效（已解决）
在写项目的时候运用了bootstrap技术,但是在浏览器上访问的时候发现图标失效了? 最终解决方案在pom文件里加入 <build><resources><resourc ...
解决Echarts窗口自适应失效问题
解决Echarts窗口自适应失效问题参考文章: (1)解决Echarts窗口自适应失效问题 (2)https://www.cnblogs.com/chuanqi1995/p/11543765.htm ...
【已解决】Vue3+Element-plus中input输入框中图标不显示
[已解决]Vue3+Element-plus中input文本框中图标不显示前言一.官网二.步骤 1.图标按需导入 2.图标注册 3.属性绑定前言今天博主正在学习Springboot+Vue的 ...
Win7中右下角“小喇叭”声音图标消失的解决方法？（已解决）
Win7中右下角"小喇叭"声音图标消失的解决方法?(已解决) 1.打开任务管理器. 2.右键explorer.exe选择右键结束. 3.在按ctrl+shift+Esc,或者用al ...
解决Echarts图标resize函数报错
解决Echarts图标resize函数报错问题需求:当页面大小变化时,图表进行重新绘制,响应页面尺寸. 修改之前: // 使用刚指定的配置项和数据显示图表.this.pieChart.setOpti ...
uniapp使用第三方字体(比如宋体楷体等非图标)已解决，字体包过大（提取字体）
uniapp使用第三方字体(比如宋体楷体等非图标)已解决 2021 1 14 最新方案直接这样就可以了 @font-face {font-family: test;font-weight: norm ...
mysql 服务端是否正常运行_如何确定mysql是否正常运行？(问题已解决:结帖)
你的位置: 问答吧 -> MySQL -> 问题详情如何确定mysql是否正常运行?(问题已解决:结帖) 我按照置顶的贴子安装了mysql5.0 可是没有所说的:" 右下角任务 ...
（已解决）ubuntu16.04蓝牙耳机与电脑配对成功，但不出现在声音输出设备里
(已解决)ubuntu16.04蓝牙耳机与电脑配对成功,但不出现在声音输出设备里 Ubuntu 16.04 + 小米1000XM3蓝牙耳机问题:电脑与蓝牙耳机配对成功.连接成功,但是声音设备里只有电 ...
linux中无法联网小电脑图标不见,电脑桌面上的网络连接图标突然不见怎么解决?...
用户刚安装好WindowsXP之后,桌面上只有"回收站"看管桌面,"我的电脑"和"网上邻居"也不见了踪影,就连最基本的"Inter ...

Echarts图标自适应问题(已解决)

Echarts图标自适应问题(已解决)相关推荐

最新文章

热门文章