如何将css格式应用于pd.DataFrame而不显示索引列

时间：2017-08-01 22:08:17

标签： html css python-3.x pandas dataframe

简单地说，我的目标是在我的html页面中显示一个表格，看起来很正常＆＃39; （也就是所有标题都在一行上，没有行号），每个单元格都根据规则查找进行颜色编码（需要灵活地为每个单元格查找不同的规则。）我的数据存储在pd中.DataFrame对象。有时我的数据更好地表示为数据透视表（多个索引）。格式化是最终用户的要求。文件系统访问非常有限，所有这些都是多线程的，所以我真的没有选择编写html然后读取 - 修改 - 写。

有关操作环境的一些信息：

  • Python 3.5.2
  • Pandas版本0.19.2
  • 需要在x86和x64上运行
  • 需要在Windows和Linux上运行

样本设置：

import pandas as pd
import numpy as np
df = pd.DataFrame()
df['special_col_1'] = pd.Series([0,0,0,1,1,1])
df['special_col_2'] = pd.Series([0,1,2,0,1,2])
df['a'] = pd.Series(np.random.randn(6)).apply(lambda x: int(x*100))
df['b'] = pd.Series(np.random.randn(6)).apply(lambda x: int(x*100))
df['c'] = pd.Series(np.random.randn(6)).apply(lambda x: int(x*100))

basic_limits = {'a': lambda x: 'background-color: red' if x < 0 else 'background-color: green',\
                'b': lambda x: 'background-color: red' if x < 10 else 'background-color: green', \
                'c': lambda x: 'background-color: red' if x > 20 else 'background-color: green', \
                'special_col_1': lambda x: 'background-color: white', \
                'special_col_2': lambda x: 'background-color: white'}

我尝试过的例子之后是为什么我不喜欢它们：

df.to_html(index=False)

一切都正确布局了 无法找到任何方法为每个单元格应用css 

pd.pivot_table(data=df, columns=['special_col_1', 'special_col_2']).to_html(index=False)

布局不正确，第一行应包含所有标签
无法找到任何方法为每个单元格应用css 

dfs = df.style
for col in df.columns:
    dfs.applymap(basic_limits[col], subset=col)

布局不正确 - 不应该有行号（索引）但是一旦你从pd.DataFrame转到pd.DataFrame.Styler
可以使用lambda函数的字典正确应用CSS样式 可以修改为迭代行和列，applymap（）仍然可以工作（需要一个更复杂的lambda函数的多级dict）

df.pivot_table(data=df, columns=???).style(...)

指定[＆＃39; special_col_1＆＃39;，＆＃39; special_col_2＆＃39;]再次打破顶行的格式 不指定任何列是不可接受的（＆＃39; ValueError：没有通过组键！＆＃39;）
具有作为pd.DataFrame.Styler对象

的所有好处和缺点

任何帮助将不胜感激！对不起，我不能包含表格的图片，这是我的第一篇文章。

确认的工作答案（piRSquared）提供了我所寻求的灵活性：

df = pd.DataFrame()
dfs = df.style

#iterate through dataframe's columns, applying custom function to each cell in the column
for col in df.columns: 
    dfs.applymap(cell_based_function_dict[col], subset=col)

#apply a function to each column
col_based_function = lambda c: pd.Series(['background-color: white' if c.name in ['special_col_1', 'special_col_2'] else 'background-color: red' if x == c.max() else 'background-color: orange' if x > 0 else 'background-color: green' for x in c])
dfs.apply(col_based_function)

#define css specifics for this particular table
styler.set_table_styles([\
    {'selector': 'tr :first-child', 'props': [('display', 'none')]}, \
    {'selector': 'tr:hover td', 'props': [('background-color',  'yellow')]}, \
    {'selector': 'th, td', 'props': [('border', '1px solid black'), \
                                     ('padding', '4px'), \
                                     ('text-align', 'center')]}, \
    {'selector': 'th', 'props': [('font-weight', 'bold')]}, \
    {'selector': '', 'props': [('border-collapse', 'collapse'),\
                               ('border', '1px solid black')]} \
    ])

#all the styling appears to be tied only to this particular dataframe table, so you can easily call render() on different tables of different styles
dfs.render()

2 个答案:

答案 0 :(得分：1)

您可以将CSS类添加到df.to_html生成的html中，如以下文档中所述：

  

classes：str或list或tuple，default无要应用的CSS类   生成的html表

因此，对于此示例代码：

import pandas as pd 

df = pd.DataFrame() 
df['special_col_1'] = pd.Series([0,0,0,1,1,1])
df['special_col_2'] = pd.Series([0,1,2,0,1,2])

print(df.head())

df.to_html("my_html_file.html", index=False)

你会得到以下html：

<table border="1" class="dataframe">
  <thead>
    <tr style="text-align: right;">
      <th>special_col_1</th>
      <th>special_col_2</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>0</td>
      <td>0</td>
    </tr>
    <tr>
      <td>0</td>
      <td>1</td>
    </tr>
    <tr>
      <td>0</td>
      <td>2</td>
    </tr>
    <tr>
      <td>1</td>
      <td>0</td>
    </tr>
    <tr>
      <td>1</td>
      <td>1</td>
    </tr>
    <tr>
      <td>1</td>
      <td>2</td>
    </tr>
  </tbody>
</table>

现在，如果你想进一步设计这个样式，你需要将所有生成的html与适当的css类包装到一个html页面中，并在CSS中定义你想要的样式。

以下是使用此处{material {{}}

中的materializecss库的样式示例

在您的代码中，您将添加css类table和striped，如下所示：

import pandas as pd 

df = pd.DataFrame() 
df['special_col_1'] = pd.Series([0,0,0,1,1,1])
df['special_col_2'] = pd.Series([0,1,2,0,1,2])

print(df.head())

# using classes table and striped from materializecss library 
df.to_html("my_html_file.html", classes="table striped", index=False)

输出html需要包装成一个html页面结构，我们在其中调用包含CSS代码的materializecss库：

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.1/css/materialize.min.css">
</head>
<body>
<table border="1" class="dataframe table striped">
  <thead>
    <tr style="text-align: right;">
      <th>special_col_1</th>
      <th>special_col_2</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>0</td>
      <td>0</td>
    </tr>
    <tr>
      <td>0</td>
      <td>1</td>
    </tr>
    <tr>
      <td>0</td>
      <td>2</td>
    </tr>
    <tr>
      <td>1</td>
      <td>0</td>
    </tr>
    <tr>
      <td>1</td>
      <td>1</td>
    </tr>
    <tr>
      <td>1</td>
      <td>2</td>
    </tr>
  </tbody>
</table>
</body>
</html>

运行代码段以查看表格的样式。

答案 1 :(得分：1)

您可以使用pd.DataFrame.style.set_table_styles

我们可以继续使用相同的样式对象并更新它。

dfs = df.style
for col in df.columns:
    dfs.applymap(basic_limits[col], subset=col)

dfs.set_table_styles([
    {'selector': 'tr :first-child',
     'props': [('display', 'none')]}
])

enter image description here

您可以使用;来抑制输出，但仍然可以获取html 

dfs = df.style
for col in df.columns:
    dfs.applymap(basic_limits[col], subset=col)

dfs.set_table_styles([
    {'selector': 'tr :first-child',
     'props': [('display', 'none')]}
]);

my_html = dfs.render()
相关问题
最新问题