Skip to content

Instantly share code, notes, and snippets.

@pn11

pn11/pandas_font_color.ipynb

Last active April 19, 2022 10:53
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save pn11/7be89fdccee07cabc371ff587d7ade70 to your computer and use it in GitHub Desktop.
Save pn11/7be89fdccee07cabc371ff587d7ade70 to your computer and use it in GitHub Desktop.
Download ZIP
pandas_font_color.ipynb
Display the source blob
Display the rendered blob
Raw
pandas_font_color.ipynb
{
"nbformat": 4,
"nbformat_minor": 0,
"metadata": {
"colab": {
"name": "Untitled1.ipynb",
"provenance": [],
"authorship_tag": "ABX9TyORj3B6faNZ+YLEW4Avc0cb",
"include_colab_link": true
},
"kernelspec": {
"name": "python3",
"display_name": "Python 3"
},
"language_info": {
"name": "python"
}
},
"cells": [
{
"cell_type": "markdown",
"metadata": {
"id": "view-in-github",
"colab_type": "text"
},
"source": [
"<a href=\"https://colab.research.google.com/gist/pn11/7be89fdccee07cabc371ff587d7ade70/untitled1.ipynb\" target=\"_parent\"><img src=\"https://colab.research.google.com/assets/colab-badge.svg\" alt=\"Open In Colab\"/></a>"
]
},
{
"cell_type": "code",
"execution_count": 1,
"metadata": {
"id": "Rbmzce4Kah5f"
},
"outputs": [],
"source": [
"from IPython.display import display, HTML\n",
"import pandas as pd"
]
},
{
"cell_type": "code",
"source": [
"dic = {\n",
" '国旗': ['日本', 'アメリカ'],\n",
" '色': [\n",
" '白、_RED_START_紅_END_',\n",
" '白、_BLUE_START_青_END_、_RED_START_赤_END_'\n",
" ]\n",
"}\n",
"df = pd.DataFrame(dic)\n",
"df"
],
"metadata": {
"colab": {
"base_uri": "https://localhost:8080/",
"height": 112
},
"id": "0ICC0Z7Zaup9",
"outputId": "2e53861b-9ce7-4cec-8842-3ef3f5cd2781"
},
"execution_count": 2,
"outputs": [
{
"output_type": "execute_result",
"data": {
"text/plain": [
" 国旗 色\n",
"0 日本 白、_RED_START_紅_END_\n",
"1 アメリカ 白、_BLUE_START_青_END_、_RED_START_赤_END_"
],
"text/html": [
"\n",
" <div id=\"df-e3a4e606-8a5c-4bd4-b50c-13ed1599dec9\">\n",
" <div class=\"colab-df-container\">\n",
" <div>\n",
"<style scoped>\n",
" .dataframe tbody tr th:only-of-type {\n",
" vertical-align: middle;\n",
" }\n",
"\n",
" .dataframe tbody tr th {\n",
" vertical-align: top;\n",
" }\n",
"\n",
" .dataframe thead th {\n",
" text-align: right;\n",
" }\n",
"</style>\n",
"<table border=\"1\" class=\"dataframe\">\n",
" <thead>\n",
" <tr style=\"text-align: right;\">\n",
" <th></th>\n",
" <th>国旗</th>\n",
" <th>色</th>\n",
" </tr>\n",
" </thead>\n",
" <tbody>\n",
" <tr>\n",
" <th>0</th>\n",
" <td>日本</td>\n",
" <td>白、_RED_START_紅_END_</td>\n",
" </tr>\n",
" <tr>\n",
" <th>1</th>\n",
" <td>アメリカ</td>\n",
" <td>白、_BLUE_START_青_END_、_RED_START_赤_END_</td>\n",
" </tr>\n",
" </tbody>\n",
"</table>\n",
"</div>\n",
" <button class=\"colab-df-convert\" onclick=\"convertToInteractive('df-e3a4e606-8a5c-4bd4-b50c-13ed1599dec9')\"\n",
" title=\"Convert this dataframe to an interactive table.\"\n",
" style=\"display:none;\">\n",
" \n",
" <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\"viewBox=\"0 0 24 24\"\n",
" width=\"24px\">\n",
" <path d=\"M0 0h24v24H0V0z\" fill=\"none\"/>\n",
" <path d=\"M18.56 5.44l.94 2.06.94-2.06 2.06-.94-2.06-.94-.94-2.06-.94 2.06-2.06.94zm-11 1L8.5 8.5l.94-2.06 2.06-.94-2.06-.94L8.5 2.5l-.94 2.06-2.06.94zm10 10l.94 2.06.94-2.06 2.06-.94-2.06-.94-.94-2.06-.94 2.06-2.06.94z\"/><path d=\"M17.41 7.96l-1.37-1.37c-.4-.4-.92-.59-1.43-.59-.52 0-1.04.2-1.43.59L10.3 9.45l-7.72 7.72c-.78.78-.78 2.05 0 2.83L4 21.41c.39.39.9.59 1.41.59.51 0 1.02-.2 1.41-.59l7.78-7.78 2.81-2.81c.8-.78.8-2.07 0-2.86zM5.41 20L4 18.59l7.72-7.72 1.47 1.35L5.41 20z\"/>\n",
" </svg>\n",
" </button>\n",
" \n",
" <style>\n",
" .colab-df-container {\n",
" display:flex;\n",
" flex-wrap:wrap;\n",
" gap: 12px;\n",
" }\n",
"\n",
" .colab-df-convert {\n",
" background-color: #E8F0FE;\n",
" border: none;\n",
" border-radius: 50%;\n",
" cursor: pointer;\n",
" display: none;\n",
" fill: #1967D2;\n",
" height: 32px;\n",
" padding: 0 0 0 0;\n",
" width: 32px;\n",
" }\n",
"\n",
" .colab-df-convert:hover {\n",
" background-color: #E2EBFA;\n",
" box-shadow: 0px 1px 2px rgba(60, 64, 67, 0.3), 0px 1px 3px 1px rgba(60, 64, 67, 0.15);\n",
" fill: #174EA6;\n",
" }\n",
"\n",
" [theme=dark] .colab-df-convert {\n",
" background-color: #3B4455;\n",
" fill: #D2E3FC;\n",
" }\n",
"\n",
" [theme=dark] .colab-df-convert:hover {\n",
" background-color: #434B5C;\n",
" box-shadow: 0px 1px 3px 1px rgba(0, 0, 0, 0.15);\n",
" filter: drop-shadow(0px 1px 2px rgba(0, 0, 0, 0.3));\n",
" fill: #FFFFFF;\n",
" }\n",
" </style>\n",
"\n",
" <script>\n",
" const buttonEl =\n",
" document.querySelector('#df-e3a4e606-8a5c-4bd4-b50c-13ed1599dec9 button.colab-df-convert');\n",
" buttonEl.style.display =\n",
" google.colab.kernel.accessAllowed ? 'block' : 'none';\n",
"\n",
" async function convertToInteractive(key) {\n",
" const element = document.querySelector('#df-e3a4e606-8a5c-4bd4-b50c-13ed1599dec9');\n",
" const dataTable =\n",
" await google.colab.kernel.invokeFunction('convertToInteractive',\n",
" [key], {});\n",
" if (!dataTable) return;\n",
"\n",
" const docLinkHtml = 'Like what you see? Visit the ' +\n",
" '<a target=\"_blank\" href=https://colab.research.google.com/notebooks/data_table.ipynb>data table notebook</a>'\n",
" + ' to learn more about interactive tables.';\n",
" element.innerHTML = '';\n",
" dataTable['output_type'] = 'display_data';\n",
" await google.colab.output.renderOutput(dataTable, element);\n",
" const docLink = document.createElement('div');\n",
" docLink.innerHTML = docLinkHtml;\n",
" element.appendChild(docLink);\n",
" }\n",
" </script>\n",
" </div>\n",
" </div>\n",
" "
]
},
"metadata": {},
"execution_count": 2
}
]
},
{
"cell_type": "code",
"source": [
"html = df.to_html()\n",
"print(html)\n",
"display(HTML(html))"
],
"metadata": {
"colab": {
"base_uri": "https://localhost:8080/",
"height": 477
},
"id": "uiOcRJOCb6rg",
"outputId": "48ddeb80-3df7-40f5-e00f-eecfa3935ef8"
},
"execution_count": 3,
"outputs": [
{
"output_type": "stream",
"name": "stdout",
"text": [
"<table border=\"1\" class=\"dataframe\">\n",
" <thead>\n",
" <tr style=\"text-align: right;\">\n",
" <th></th>\n",
" <th>国旗</th>\n",
" <th>色</th>\n",
" </tr>\n",
" </thead>\n",
" <tbody>\n",
" <tr>\n",
" <th>0</th>\n",
" <td>日本</td>\n",
" <td>白、_RED_START_紅_END_</td>\n",
" </tr>\n",
" <tr>\n",
" <th>1</th>\n",
" <td>アメリカ</td>\n",
" <td>白、_BLUE_START_青_END_、_RED_START_赤_END_</td>\n",
" </tr>\n",
" </tbody>\n",
"</table>\n"
]
},
{
"output_type": "display_data",
"data": {
"text/plain": [
"<IPython.core.display.HTML object>"
],
"text/html": [
"<table border=\"1\" class=\"dataframe\">\n",
" <thead>\n",
" <tr style=\"text-align: right;\">\n",
" <th></th>\n",
" <th>国旗</th>\n",
" <th>色</th>\n",
" </tr>\n",
" </thead>\n",
" <tbody>\n",
" <tr>\n",
" <th>0</th>\n",
" <td>日本</td>\n",
" <td>白、_RED_START_紅_END_</td>\n",
" </tr>\n",
" <tr>\n",
" <th>1</th>\n",
" <td>アメリカ</td>\n",
" <td>白、_BLUE_START_青_END_、_RED_START_赤_END_</td>\n",
" </tr>\n",
" </tbody>\n",
"</table>"
]
},
"metadata": {}
}
]
},
{
"cell_type": "code",
"source": [
"html = html.replace('_RED_START_', '<font color=\"red\">').replace('_BLUE_START_', '<font color=\"blue\">').replace('_END_', '</font>')\n",
"print(html)\n",
"display(HTML(html))"
],
"metadata": {
"colab": {
"base_uri": "https://localhost:8080/",
"height": 477
},
"id": "kuNEWNywcABl",
"outputId": "faee5f48-f41f-4ca3-c2cf-61d2abd6d422"
},
"execution_count": 4,
"outputs": [
{
"output_type": "stream",
"name": "stdout",
"text": [
"<table border=\"1\" class=\"dataframe\">\n",
" <thead>\n",
" <tr style=\"text-align: right;\">\n",
" <th></th>\n",
" <th>国旗</th>\n",
" <th>色</th>\n",
" </tr>\n",
" </thead>\n",
" <tbody>\n",
" <tr>\n",
" <th>0</th>\n",
" <td>日本</td>\n",
" <td>白、<font color=\"red\">紅</font></td>\n",
" </tr>\n",
" <tr>\n",
" <th>1</th>\n",
" <td>アメリカ</td>\n",
" <td>白、<font color=\"blue\">青</font>、<font color=\"red\">赤</font></td>\n",
" </tr>\n",
" </tbody>\n",
"</table>\n"
]
},
{
"output_type": "display_data",
"data": {
"text/plain": [
"<IPython.core.display.HTML object>"
],
"text/html": [
"<table border=\"1\" class=\"dataframe\">\n",
" <thead>\n",
" <tr style=\"text-align: right;\">\n",
" <th></th>\n",
" <th>国旗</th>\n",
" <th>色</th>\n",
" </tr>\n",
" </thead>\n",
" <tbody>\n",
" <tr>\n",
" <th>0</th>\n",
" <td>日本</td>\n",
" <td>白、<font color=\"red\">紅</font></td>\n",
" </tr>\n",
" <tr>\n",
" <th>1</th>\n",
" <td>アメリカ</td>\n",
" <td>白、<font color=\"blue\">青</font>、<font color=\"red\">赤</font></td>\n",
" </tr>\n",
" </tbody>\n",
"</table>"
]
},
"metadata": {}
}
]
}
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment