css - 在 Flex 组件中设置不同的图表数据提示样式

Question

我有以下问题:我的任务是在 Flex 4.5 中为两个图表设置数据提示样式。两个图表位于两个不同的 <Group> 中。添加到 <Application> 的基于组件

所以经过彻底的研究后，我尝试这样做。首先应用 css 降序选择器:

#container#chart1 chartClasses|DataTip{     
    backgroundColor:white;
    backgroundAlpha:0.01;
    fontSize: 12; 
    fontWeight:bold;
    fontStyle:italic; 
}

所以组件的 Id=container 和里面的图表 id="chart1" 尽管 Adob​​e 文档说它应该，但它不起作用。 我认为应该解决的另一种方法是将此 CSS 样式放在一起

chartClasses|DataTip{
    backgroundColor:white;
    backgroundAlpha:0.01;
    fontSize: 12; 
    fontWeight:bold;
    fontStyle:italic; 
}

在这些组件中的每一个中，但猜猜是什么，图表数据提示类选择器仅适用于 <Application>级别(然后它将相同的样式应用于应用程序中找到的所有图表数据提示。因此将它放在包含图表的两个组件中的每一个中都没有效果。

接下来，我创建了一个类，该类被馈送到图表的 dataTipRenderer 样式。然后在名为 MyCustomDataTipRenderer 的类中，我设置了类选择器:

.dataTip{
    backgroundColor:white;
    backgroundAlpha:0.01;
    fontSize: 12; 
    fontWeight:bold;
    fontStyle:italic; 
}

是的，它有效。但是假设我希望能够根据托管图表为自定义数据提示渲染器设置不同的样式。我该怎么做？似乎 Flex SDK 没有以任何方式暴露 datatipRenderer。所以如果我像这样有效地设置自定义数据提示渲染器:

columnchart1.setStyle("dataTipRenderer",CustomDataTip); 

然后我希望能够访问 CustomDataTip 类的实例。但我不能。所以目前我唯一能做的就是为每个图表创建一个不同的自定义数据提示渲染器类。那可以如果您只有几个图表要设置样式，那很好，但是如果我们有很多图表，我们该怎么办？

Answer 1

尝试将以下内容添加到 css 文件的开头(假设文件的名称是 chartStyles.css)

@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "http://www.adobe.com/2006/mxml";

mx|#container#chart1 chartClasses|DataTip{     
    backgroundColor:white;
    backgroundAlpha:0.01;
    fontSize: 12; 
    fontWeight:bold;
    fontStyle:italic; 
}

s|#container#chart1 chartClasses|DataTip{     
    backgroundColor:white;
    backgroundAlpha:0.01;
    fontSize: 12; 
    fontWeight:bold;
    fontStyle:italic; 
}

如果css样式直接放在主应用程序mxml中的style标签中，那么一开始就不需要@namespace标签了。你可以直接添加mx|和|作为样式的前缀。