Bokeh Tooltips Json.loads在HTML代码上给出Expecting，delimiter错误

Question

我正在尝试通过flask发送一个包含用于bokeh.tooltips的HTML脚本的json对象。

以下是相关的代码：

import pandas as pd
# import matplotlib.pyplot as plt
# %matplotlib inline
import datetime
from datetime import date
import calendar
# import math
import numpy as np
import pymysql
from random import randint
# import calendar
import itertools

from bokeh.models import ColumnDataSource, DataRange1d\
,Plot, LinearAxis, Grid,Label,LabelSet,HoverTool,NumeralTickFormatter
from bokeh.models.glyphs import HBar
from bokeh.io import curdoc, show, output_file
from bokeh.models.layouts import Column
from bokeh.resources import INLINE
import bokeh.io
bokeh.io.output_notebook() 
from bokeh.plotting import figure
from bokeh.sampledata.commits import data
from bokeh.transform import jitter
from bokeh.models.widgets import Panel, Tabs
from bokeh.layouts import widgetbox, Column
from bokeh.models.widgets import DataTable, DateFormatter, TableColumn,NumberFormatter,Panel, Tabs
from bokeh.palettes import Spectral9 as palette

def Show_NameBased_Chart(in_dict):

    source = ColumnDataSource(
    data=dict(
        Count = [val.get('size') for val in in_dict.values()],

#         Unique_guests = Transaction_data[Transaction_data.chain_id == CID]\
#         .groupby('merchant_id').user_id.nunique().tolist(),

        Sales = [val.get('amount_spent') for val in in_dict.values()],

        ID  = [val for val in in_dict.keys()],

#         Name  = Transaction_data[Transaction_data.chain_id == CID]\
#                 .groupby('name').sum().index.astype(str).tolist(),

        AVG = [val.get('avg') for val in in_dict.values()],

    ))

    ID = [val for val in in_dict.keys()]

#     Name  = Transaction_data[Transaction_data.chain_id == CID]\
#                 .groupby('name').sum().index.astype(str).tolist()

#     Label = Transaction_data[Transaction_data.chain_id == CID].location.unique()[0]

    hover = HoverTool(tooltips="""
    <div>
        <div>
            <span style='font-size: 10px;'>Merch_Id:</span>
            <span style=font-size: 15px; font-weight: bold;>@ID</span>
        <div>

        <div>
            <span style=font-size: 10px;>Revenue:</span>
            <span style= font-size:15px; font-weight: bold;>&#x20B9;</span> 
            <span style=font-size: 15px; font-weight: bold;>@Sales{0,0.000}</span>
        <div>

        <div>
            <span style=font-size: 10px;>Visits:</span>
            <span style=font-size: 15px; font-weight: bold;>@Count</span>            
        <div>

        <div>
            <span style=font-size: 10px;>Avg Val/Tr:</span>
            <span style= font-size:15px; font-weight: bold;>&#x20B9;</span> 
            <span style=font-size: 15px; font-weight: bold;>@AVG</span>


        <div>

        <div>
            <span style=font-size: 10px;>Mode:</span>
            <span style= font-size:15px; font-weight: bold;>&#x20B9;</span> 
            <span style=font-size: 15px; font-weight: bold;>@Mode</span>

        <div>

        <div>
            <span style=font-size: 10px;>Unique_Visitors:</span>
            <span style=font-size: 15px; font-weight: bold;>@Unique_guests</span>

        </div>
    </div>
    """
    )
    p = figure(y_range= ID)
    # p.background_fill_color = None
    # p.background_fill_alpha = None
    # labels = LabelSet(x='Count', y='ID', text='Count', level='glyph',
    #                y_offset=5, render_mode='canvas',source=source)
    p.add_tools(hover)
    p.grid.grid_line_color = None
    p.xaxis.visible = None
    p.yaxis.axis_line_color = None
    p.xaxis.axis_line_color = None
    p.xaxis.major_tick_line_color = None
    p.xaxis.minor_tick_line_color = None
    p.outline_line_alpha = 0.2
    H_1= HBar(y='ID',right='Sales',height = 0.5,fill_color="#6C69EB")
    # H_2 = HBar(y='ID',right='Sales',height = 0.5)
    p.add_glyph(source, H_1)
    # p_2 = p.add_glyph(source, H_2)


    # p.add_layout(labels)
#     show(p)
    return (components(p))

script, div = ShowNameBasedChart(in_dict)
render_index = script.find('render_items = [{"')
render_ending = script.find('"}];')
div_index = div.find('id="')
div_ending = div.find('"></')
docs_index = script.find('\'{"')
docs_ending = script.find("}}';")
{'docs_json':json.loads((script[docs_index+1:docs_ending+2])),\
                    'render_item':json.loads(script[render_index + 15:render_ending+3]),\
                    'div_id':div[div_index+4:div_ending]}

in_dict = {u'1009': {u'Avg': 408.1859554880508,
  u'amount_spent': 185851,
  u'size': 444,
  u'users': [216765,
   632270,
   416138,
   267154,
   220339,
   346041,
   657993,
   658316,
   576653,
   658567,
   658406,
   658546]},
 u'1056': {u'Avg': 436.19081688035646,
  u'amount_spent': 87690,
  u'size': 311,
  u'users': [213761,
   647666,
   639524,
   562168,
   164913,
   645767]},
 u'1103': {u'Avg': 169.83717357910908,
  u'amount_spent': 12734,
  u'size': 69,
  u'users': [370590,
   353842,
   617525,
   339285,
   658440]},
 u'1105': {u'Avg': 260.63440860215053,
  u'amount_spent': 15814,
  u'size': 56,
  u'users': [187569,
   575770,
   91651,
   19981,
   8966,
   19863
   ]}

当代码运行时，它会在'docs_json'上出错。json.loads((script[docs_index+1:docs_ending+2]))的相关简洁版本如下：

('{"attributes":{"callback":null,"tooltips":"\\\\n    <div>\\\\n        <div>\\\\n            <span style=\\\\"font-size: 10px;\\\\">Merch_Id:</span>\\\\n            <span style=\\\\"font-size: 15px; font-weight: bold;\\\\">@ID</span>\\\\n        </div>\\\\n        <div>\\\\n            <span style=\\\\"font-size: 10px;\\\\">Revenue:</span>\\\\n            <span style=\\\\"font-size:15px; font-weight: bold;\\\\">₹</span> \\\\n            <span style=\\\\"font-size: 15px; font-weight: bold;\\\\">@Sales{0,0.000}</span>\\\\n        </div>\\\\n        <div>\\\\n            <span style=\\\\"font-size: 10px;\\\\">Visits:</span>\\\\n            <span style=\\\\"font-size: 15px; font-weight: bold;\\\\">@Count</span>            \\\\n        </div>\\\\n        <div>\\\\n            <span style=\\\\"font-size: 10px;\\\\">Avg Val/Tr:</span>\\\\n            <span style=\\\\"font-size:15px; font-weight: bold;\\\\">₹</span> \\\\n            <span style=\\\\"font-size: 15px; font-weight: bold;\\\\">@AVG</span>\\\\n        </div>\\\\n        <div>\\\\n            <span style=\\\\"font-size: 10px;\\\\">Mode:</span>\\\\n            <span style=\\\\"font-size:15px; font-weight: bold;\\\\">₹</span> \\\\n            <span style=\\\\"font-size: 15px; font-weight: bold;\\\\">@Mode</span>\\\\n        </div>\\\\n        <div>\\\\n            <span style=\\\\"font-size: 10px;\\\\">Unique_Visitors:</span>\\\\n            <span style=\\\\"font-size: 15px; font-weight: bold;\\\\">@Unique_guests</span>\\\\n\\\\n        </div>\\\\n    </div>\\\\n    "}')

当我json.loads上面的代码时，我的代码似乎失败并显示错误：ValueError: Expecting , delimiter: line 1 column 117 (char 116)。 有什么办法，我可以通过这个或另一个json解码器函数添加HTML标签吗？