{% set data = j2_provider_roi_data(request) %}
{% set bubble_data = [] %}{% for r in data %}{% set _ = bubble_data.append([r.get("unit_price",0)|float, r.get("avg_ttft_ms",0)|float, r.get("total_calls",0)|int, r.get("model","")]) %}{% endfor %}
{% set script %}(function(){var c=echarts.init(document.getElementById('chart_provider_roi'));c.setOption({tooltip:{trigger:'item',formatter:function(p){return p.data[3]+'<br/>单价:'+p.data[0]+'/t<br/>延迟:'+p.data[1]+'ms<br/>调用:'+p.data[2]+'次'}},xAxis:{type:'value',name:'单价(¥/t)',nameLocation:'center',nameGap:25},yAxis:{type:'value',name:'延迟(ms)',nameLocation:'center',nameGap:35},series:[{type:'scatter',symbolSize:function(d){return Math.max(8,Math.sqrt(d[2])*0.5)},data:{{json.dumps(bubble_data,ensure_ascii=False)}},label:{show:true,formatter:function(p){return p.data[3]},position:'top',fontSize:10}}]});window.addEventListener('resize',function(){c.resize()});})();{% endset %}
{
    "widgettype": "WebWidget",
    "options": {
        "height": "240px",
        "html": "<div id=\"chart_provider_roi\" style=\"width:100%;height:240px;\"></div>",
        "script": {{json.dumps(script, ensure_ascii=False)}}
    }
}