FusionCharts简单教程(三)-----如何自定义图表上的工具提示
最近有蛮多人总是问我这个FusionCharts制表的问题,帮助他们解决之后,在昨晚发现以前整理的笔记中有这个简单教程,而且以前也发表了几篇这个博文,所以就将其全部上传上来供别人参考。如有不正确之处望指正!!!!
所谓图表上的工具提示就是当鼠标放在某个特定的数据块上时所显示的提示信息。如下:
禁用显示工具提示
在默认情况下工具提示功能是显示的,但是有时候我们并不是很想需要这个功能提示功能,这个时候我们就希望能够禁用该功能。我们可以通过设置showToolTip='0'来禁用工具提示。
自定义文本
我们可以通过<set…/>元素的tooltext属性来给某个数据点设置特定的工具提供,也就是自定义文本显示。
<graph caption='每月销售额柱形图' xAxisName='月份' yAxisName='Units' showNames='1' decimalPrecision='0' formatNumberScale='0'>
......
<set name='八月' value='544' color='588526' />
<set name='九月' value='565' color='B3AA00' />
<set name='十月' value='754' color='008ED6' toolText='销售量最大'/>
<set name='十一月' value='441' color='9D080D' />
<set name='十二月' value='654' color='A186BE' />
</graph>
自定义背景颜色和边框
对于一个白色背景、黑色文字和黑色背景而已还真不是特别的“漂亮”,好在FusionCharts提供了toolTipBorderColor和toolTipBgColor这两个属性用来帮助我们自定义工具提示的背景色和边框颜色。
<graph caption='每月销售额柱形图' xAxisName='月份' yAxisName='Units' showNames='1' toolTipBorderColor='9D080D' toolTipBgColor='F7D7D1'>
......
</graph>
对于字体的设置,我们需要使用自定义样式来进行改变。这个下面在介绍。
多行提示
如果某个工具提示的内容太多,那么这个提示信息就会显示的特别的长。
对于这样的提示信息我们是非常不愿意见到的。这里我们就希望它能够多行、分段显示。这里我们可以通过使用伪代码{BR}来进行分段处理。
使用自定义样式改变字体样式
在XML中,我们能够利用样式来改变文本的字体样式。
<graph caption='每月销售额柱形图' xAxisName='月份' yAxisName='Units' showNames='1' toolTipBorderColor='9D080D' toolTipBgColor='F7D7D1'>
<set name='一月' value='100' color='AFD8F8' />
<set name='二月' value='200' color='F6BD0F' />
.......
<set name='十二月' value='654' color='A186BE' />
<styles>
<definition>
<style name='myToolTipFont' type='font' font='Verdana' size='14' color='008ED6F'/>
</definition>
<application>
<apply toObject='ToolTip' styles='myToolTipFont' />
</application>
</styles>
</graph>
更多请阅读:
>>>>>>>FusionCharts简单教程(一)---建立第一个FusionCharts图形
>>>>>>>FusionCharts简单教程(二)-----使用js加载图像和setDataXML()加载数据
>>>>>>>FusionCharts简单教程(四)-----基本数字格式
FusionCharts简单教程(三)-----如何自定义图表上的工具提示的更多相关文章
- FusionCharts简单教程(六)-----如何自定义图表上的工具提示
所谓图表上的工具提示就是当鼠标放在某个特定的数据块上时所显示的提示信息.如下: 禁用显示工具提示 在默认情况下工具提示功能是显示的,但是有时候我们并不是很想需要这个功能提示功能 ...
- FusionCharts简单教程(三)-----FusionCharts的基本属性
通过前面两章的讲解我们可以制作出简单的图像,但是有时候我们需要对图像进行一个精确的规划,比如设置背景颜色.设置提示信息.设置间隔颜色等等,这时就需要我们对FusionCharts的细节有比 ...
- FusionCharts简单教程(八)-----使用网格组件
有时候我们会觉得使用图像不够直接,对于数据的显示没有表格那样直接明了.所以这里就介绍如何使用网格组件.将网格与图像结合起来.网格组件能够将FusionCharts中的单序列数据以列表的 ...
- 如何自定义FusionCharts图表上的工具提示?
中的工具提示是什么?当鼠标悬停在一个特定的数据点上时就会显示工具提示,提示以下信息: 单系列图表(饼图和圆环除外):名称及数值 Pie & Doughnut:名称及数值/百分比 多系列组合图表 ...
- FusionCharts简单教程(四)-----基本数字格式
在统计图例中什么是最基本,最重要的元素?那就是数据.一个数据的统计图像那就是一堆空白.但是数据存在多种形式,比如小数,比如千分位等等.又如若一个数据是12.000000001,对于数据要求 ...
- Flash图表控件FusionCharts如何自定义图表上的垂直线
什么是垂直分割线 垂直(或条形图中的水平)分隔线是用来帮助用户分隔数据块的.可以被放置在任何两个数据点,即使是不规则的间隔也可以. <chart caption='Monthly Revenue ...
- FusionCharts简单教程(七)-----使用FusionCharts实现下钻功能
前面介绍的FusionCharts都是对FusionCharts的基本属性进行操作,下面几篇博文就FusionCharts的高级特性做一个介绍,包括:添加下钻链接.使用Style样式定制图 ...
- FusionCharts简单教程(一)---建立第一个FusionCharts图形
由于项目需求需要做一个报表,选择FusionCharts作为工具使用.由于以前没有接触过报表,网上也没有比较详细的fusionCharts教程,所以决定好好研究FusionCharts,同时做一个比较 ...
- FusionCharts简单教程---建立第一个FusionCharts图形
由于项目需求需要做一个报表,选择FusionCharts作为工具使用.由于以前没有接触过报表,网上也没有比较详细的fusionCharts教程,所以决定好好研究FusionCharts,同时做一个比较 ...
随机推荐
- 一起买beta版UI测试
一起买beta版UI测试 测试目的 保证代码质量,对各个单元进行测试,可以有效地保证代码的可靠性,让模块在与别的模块整合时出现更少的错误. UI测试 登录模块测试 登录模拟过程. 发帖模块测试 ...
- vpython初探
vpython 是python默认的3D模块,和python有一样的风格.与PyOpenGL相比,容易上手. vpython下载:vpython的官网(www.vpython.org).顺便说一句,官 ...
- 使用TFS 自动编译时的一点设置
MSBuild参数: /p:VisualStudioVersion=10.0 指定使用的VS编译版本
- Gray Code
Gray Code The gray code is a binary numeral system where two successive values differ in only one bi ...
- memcached总结
Memcached说明文档 Memcached是什么? Memcached 是一个高性能的分布式内存对象缓存系统,用于动态Web应用以减轻数据库负载.它通过在内存中缓存数据和对象来减少读取数据库的次数 ...
- 一些webGL的资源
作为一个新手,把资源写在这里. 一个简介: http://www.html5china.com/HTML5features/WebGL/20111129_2985.html 类似NEHE OPENGL ...
- Tomcat7下出现The requested resource(/)is not available
1首先确保你的localhost是否正常运行解决方案:1观察项目是否部署2重新将tomcat7导入 2确保你的项目名后跟index.jsp是否正常运行解决方案:1右键项目名,web进行查询,观察部署的 ...
- windows守护进程脚本
通常通过进程名称或者端口号来判断进程是否正在运行.但是windows下进程名常常难以区分,比如有两个python脚本程序A和B同时在执行,进程名都是python.exe.若是通过端口来区分,却又只适用 ...
- terminal崩溃打不开的一种原因以及ubuntu下matlab权限不够的解决办法
为了解决点击matlab图标闪退的问题,我往.bashrc添加了如下命令: source /usr/local/MATLAB/R2015b/bin/matlab 结果导致打开新的terminal闪退. ...
- C++中有符号/无符号数比较
原创文章,欢迎阅读,禁止转载. 在我的程序中有如下代码编译被警告了 if(list.size()>msize){...} warning C4018: '<' : signed/unsig ...