You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by "ulee19 (via GitHub)" <gi...@apache.org> on 2023/06/29 15:26:08 UTC
[GitHub] [echarts] ulee19 opened a new issue, #18830: the graph's width can't be full in a layui crousal container
ulee19 opened a new issue, #18830:
URL: https://github.com/apache/echarts/issues/18830
### Version
V 5.4.2
### Link to Minimal Reproduction
https://codesandbox.io/s/trusting-stallman-5m2vpw?file=/test.php
### Steps to Reproduce
when i put a chart in a layui card, it can be reponsive and displayed normally. but when i add a layui crousal in the card container, it only paint the left side of the the canvas.i have checked css of layui.crousal, and the atrribute width is set as "100%".So i think it might be something wrong with echarts.
```
<div class="layui-card" >
<div class="layui-card-header">个人已完成工作统计</div>
<div class="layui-card-body">
<div class="layui-carousel " id="ID-carousel-demo">
<div carousel-item >
<div id="main1" style="width:774px ;height:400px;background-color: #fff"></div>
<div></div>
</div>
</div>
</div>
</div>
<script>
var difficulty_evaluation_Series = {
// name: '难度评价图',
type: 'heatmap',
itemStyle: {},
label: {
show: true
},
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
},
data: []
};
var options = {
title: {},
tooltip: {
axisPointer: {
type: 'shadow'
},
position: 'right',
formatter: function (obj) {
var value = obj.value;
// prettier-ignore
return "难度" + '：' + value[1] + '<br>'
+ "评价" + '：' + value[0] + '<br>'
+ "数量" + '：' + value[2] + '<br>';
}
},
visualMap: {
min: 0,
max: 25,
calculable: true,
orient: 'horizontal',
left: 'center',
bottom: '0%',
// inRange: {
// color: ['blue', 'red'] // Specify the color range for values above zero
// },
// pieces: [
// // Add an additional visual mapping for zero value
// { value: 0, color: 'white' }
// ]
},
toolbox: {
show: true,
orient: 'vertical',
left: 'right',
top: '5%',
feature: {
mark: {show: true},
dataView: {show: true, readOnly: true},
// magicType: {show: true, type: ['bar', 'line']},
restore: {show: true},
saveAsImage: {show: true}
}
},
legend: {},
grid: {
height: '70%',
top: '13%',
containLabel: true
},
xAxis: {
name: '评价',
type: 'category',
axisLabel: {
formatter: '{value} 星'
},
nameTextStyle: {
fontSize: 16
},
splitLine: {
show: true
},
data:["未评价没","1","2","3","4","5"]
},
yAxis: {
name: '难度',
type: 'category',
axisLabel: {
formatter: '{value} 级'
},
nameTextStyle: {
fontSize: 16
},
splitArea: {
show: true
},
data:[1,2,3,4,5,6,7,8,9,10]
},
series: [difficulty_evaluation_Series]
};
//渲染chart
options && chart1.setOption(options);
//界面尺寸自适应
window.addEventListener('resize', function () {
chart1.resize();
});
</script>
<script>
layui.use(function(){
var carousel = layui.carousel;
// 渲染 - 常规轮播
carousel.render({
elem: '#ID-carousel-demo',
// width: '100%',
height: '400px',
width: 'auto',
indicator: 'card_head',
autoplay: 'true'
});
});
</script>
```
### Current Behavior
### Expected Behavior
### Environment
```markdown
- OS: win 10
- Browser: Microsoft Edge 版本 114.0.1823.58 (正式版本) (64 位)
- Framework: layui 2.7.6
```
### Any additional comments?
_No response_
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
Re: [I] the graph's width can't be full in a layui crousal container [echarts]
Posted by "github-actions[bot] (via GitHub)" <gi...@apache.org>.
github-actions[bot] closed issue #18830: the graph's width can't be full in a layui crousal container
URL: https://github.com/apache/echarts/issues/18830
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] ulee19 commented on issue #18830: the graph's width can't be full in a layui crousal container
Posted by "ulee19 (via GitHub)" <gi...@apache.org>.
ulee19 commented on issue #18830:
URL: https://github.com/apache/echarts/issues/18830#issuecomment-1613403649
<div id="main1" style="width:100%;height:400px;background-color: #fff"></div>
i am sorry there is a typing error in line 6 of the code. this is the code render the current chart
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
Re: [I] the graph's width can't be full in a layui crousal container [echarts]
Posted by "github-actions[bot] (via GitHub)" <gi...@apache.org>.
github-actions[bot] commented on issue #18830:
URL: https://github.com/apache/echarts/issues/18830#issuecomment-3017121425
This issue has been automatically marked as stale because it did not have recent activity. It will be closed in 7 days if no further activity occurs. If you wish not to mark it as stale, please leave a comment in this issue.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
Re: [I] the graph's width can't be full in a layui crousal container [echarts]
Posted by "github-actions[bot] (via GitHub)" <gi...@apache.org>.
github-actions[bot] commented on issue #18830:
URL: https://github.com/apache/echarts/issues/18830#issuecomment-3046519554
This issue has been automatically closed because it did not have recent activity. If this remains to be a problem with the latest version of Apache ECharts, please open a new issue and link this to it. Thanks!
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org