没有找到合适的产品?
联系客服协助选型:023-68661681
提供3000多款全球软件/控件产品
针对软件研发的各个阶段提供专业培训与技术咨询
根据客户需求提供定制化的软件开发服务
全球知名设计软件,显著提升设计质量
打造以经营为中心,实现生产过程透明化管理
帮助企业合理产能分配,提高资源利用率
快速打造数字化生产线,实现全流程追溯
生产过程精准追溯,满足企业合规要求
以六西格玛为理论基础,实现产品质量全数字化管理
通过大屏电子看板,实现车间透明化管理
对设备进行全生命周期管理,提高设备综合利用率
实现设备数据的实时采集与监控
利用数字化技术提升油气勘探的效率和成功率
钻井计划优化、实时监控和风险评估
提供业务洞察与决策支持实现数据驱动决策
原创|使用教程|编辑:郑恭琳|2015-12-21 14:42:36.000|阅读 2421 次
概述:本篇教程主要教大家如何给FusionCharts图表中数据图添加自定义透明度和边框效果。
# 界面/图表报表/文档/IDE等千款热门软控件火热销售中 >>
相关链接:
Fusioncharts允许你设置数据图填充颜色的透明度。效果如下图所示:

下表是自定义数据图透明度所需的属性:
| 属性名称 | 描述 |
| plotFillAlpha | 用于设置整个图表对象中所有数据图的透明度。 |
| alpha | 用于设置单个数据列的透明度。 |
上图所示的数据图自定义透明度数据结构如下:
JSON:
{
"chart": {
"caption": "Comparison of Quarterly Revenue",
"subCaption": "Harry's SuperMart",
"xAxisname": "Quarter",
"yAxisName": "Revenues (In USD)",
"numberPrefix": "$",
"plotFillAlpha": "90",
"theme": "fint"
},
"categories": [
{
"category": [
{
"label": "Q1"
},
{
"label": "Q2"
},
{
"label": "Q3"
},
{
"label": "Q4"
}
]
}
],
"dataset": [
{
"seriesname": "Previous Year",
"alpha": "30",
"data": [
{
"value": "10000"
},
{
"value": "11500"
},
{
"value": "12500"
},
{
"value": "15000"
}
]
},
{
"seriesname": "Current Year",
"data": [
{
"value": "25400"
},
{
"value": "29800"
},
{
"value": "21800"
},
{
"value": "26800"
}
]
}
]
}
XML:
<chart caption="Comparison of Quarterly Revenue" subcaption="Harry's SuperMart" xaxisname="Quarter" yaxisname="Revenues (In USD)" numberprefix="$" plotfillalpha="90" theme="fint">
<categories>
< category label="Q1" />
< category label="Q2" />
< category label="Q3" />
< category label="Q4" />
</categories>
<dataset seriesname="Previous Year" alpha="30">
< set value="10000" />
< set value="11500" />
< set value="12500" />
< set value="15000" />
</dataset>
<dataset seriesname="Current Year">
< set value="25400" />
< set value="29800" />
< set value="21800" />
< set value="26800" />
</dataset>
</chart>
显示或隐藏数据图边框
默认情况下每一个数据图(柱状图、面积图、饼图)都有边框。你可以选择显示也可以隐藏边框。

自定义数据图边框所需属性:
| 属性名称 | 描述 |
| showPlotBorder | 设置为1(默认)时显示边框,为0时隐藏边框。 |
上图所示图表的自定义边框数据结构如下:
JSON:
{
"chart": {
"caption": "Quarterly Revenue",
"subCaption": "Last year",
"xAxisName": "Quarter",
"yAxisName": "Amount (In USD)",
"numberPrefix": "$",
"theme": "fint",
"showPlotBorder": "1"
},
"data": [
{
"label": "Q1",
"value": "1950000"
},
{
"label": "Q2",
"value": "1450000"
},
{
"label": "Q3",
"value": "1730000"
},
{
"label": "Q4",
"value": "2120000"
}
]
}
XML:
<chart caption="Quarterly Revenue" subcaption="Last year" xaxisname="Quarter" yaxisname="Amount (In USD)" numberprefix="$" theme="fint" showplotborder="1">
< set label="Q1" value="1950000" />
< set label="Q2" value="1450000" />
< set label="Q3" value="1730000" />
< set label="Q4" value="2120000" />
</chart>
使用虚线边框

自定义虚线边框所需属性如下表:
| 属性名称 | 描述 |
| plotBorderDashed | 设置整个图表对象的虚线边框。为1时设置为虚线边框,为0(默认)时移除边框。 |
| plotBorderDashLen | 设置整个图表对象虚线边框的短线长度。 |
| plotBorderDashGap | 设置整个图表对象虚线边框的短线间间距。 |
| dashed | 设置单个数据列的虚线边框效果。 |
| dashlen | 设置单个数据列虚线边框的短线长度。 |
| dashgap | 设置单个数据列虚线边框的短线间间距。 |
上图所示图标的数据结构如下:
JSON:
{
"chart": {
"caption": "Quarterly Revenue",
"subCaption": "Last year",
"xAxisName": "Quarter",
"yAxisName": "Amount (In USD)",
"numberPrefix": "$",
"theme": "fint",
"showPlotBorder": "1",
"plotBorderDashed": "1",
"plotBorderDashLen": "4",
"plotBorderDashGap": "4",
"plotBorderThickness": "1",
"plotBorderColor": "#000000"
},
"data": [
{
"label": "Q1",
"value": "1950000"
},
{
"label": "Q2",
"value": "1450000"
},
{
"label": "Q3",
"value": "1730000"
},
{
"label": "Q4",
"value": "2120000"
}
]
}
XML:
<chart caption="Quarterly Revenue" subcaption="Last year" xaxisname="Quarter" yaxisname="Amount (In USD)" numberprefix="$" theme="fint" showplotborder="1" plotborderdashed="1" plotborderdashlen="4" plotborderdashgap="4" plotborderthickness="1" plotbordercolor="#000000">
< set label="Q1" value="1950000" />
< set label="Q2" value="1450000" />
< set label="Q3" value="1730000" />
< set label="Q4" value="2120000" />
</chart>
使用圆边
你可以在2D柱状图或条形图中将数据图的边框设置为圆边效果,如下图所示:

所需属性:
| 属性名称 | 描述 |
| useRoundEdges | 设置为1时显示圆边(玻璃渐变)效果。 |
上图所示图表数据结构如下:
JSON:
{
"chart": {
"caption": "Quarterly Revenue",
"subCaption": "Last year",
"xAxisName": "Quarter",
"yAxisName": "Amount (In USD)",
"numberPrefix": "$",
"theme": "fint",
"useRoundEdges": "1"
},
"data": [
{
"label": "Q1",
"value": "1950000"
},
{
"label": "Q2",
"value": "1450000"
},
{
"label": "Q3",
"value": "1730000"
},
{
"label": "Q4",
"value": "2120000"
}
]
}
XML:
<chart caption="Quarterly Revenue" subcaption="Last year" xaxisname="Quarter" yaxisname="Amount (In USD)" numberprefix="$" theme="fint" useroundedges="1">
< set label="Q1" value="1950000" />
< set label="Q2" value="1450000" />
< set label="Q3" value="1730000" />
< set label="Q4" value="2120000" />
</chart>
购买最新正版授权!详情请""
2015岁末扫尾之战!全球厂商携手放利!优惠详情点击查看>>
本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@ke049m.cn




BarTender 标签管理系统,正是帮助企业轻松实现 GS1 标准化标签设计、编码生成与信息联动的强大工具。
Parasoft C/C++test 是一款功能强大的 C/C++ 软件测试工具,集成了静态代码分析、单元测试、集成测试和覆盖率分析等功能,单元测试作为其关键功能之一,为了适配多样化的目标部署环境,C/C++test 设计了灵活的测试结果收集机制。通过Socket通讯方式来收集单元测试结果,从而扩展其测试覆盖范围与应用场景。
Parasoft C/C++test作为一款功能全面的自动化代码质量保障工具,为C/C++开发者提供了静态分析、单元测试和运行时错误检测等核心功能。通过将其与轻量级且广受欢迎的VScode编辑器集成,开发团队可以在熟悉的编码环境中实时获得代码质量反馈,有效提升开发效率与代码可靠性。
本文主要介绍如何在MVVM应用程序中使用虚拟源,欢迎下载最新版组件体验!
服务电话
重庆/ 023-68661681
华东/ 13452821722
华南/ 18100878085
华北/ 17347785263
客户支持
技术支持咨询服务
服务热线:400-700-1020
邮箱:sales@ke049m.cn
关注我们
地址 : 重庆市九龙坡区火炬大道69号6幢
半岛外围网上直营