web2py - 在 web2py 中嵌入 pygal-6ren

web2py - 在 web2py 中嵌入 pygal

转载作者：行者123 更新时间：2023-12-04 15:10:07

25

4

pygal，渲染一个 svg 并在图形字典中返回。我尝试将其嵌入到 web2py 页面中。那个有效。但我不知道如何减少页面上图表的大小。

风景:

{{extend 'layout.html'}}
<h1>Hello {{=request.vars.simulation_id}}</h1>
<figure> 
    {{=XML(one)}}
    {{=XML(two)}}
</figure>

和 default.py 函数:

def run_simulation():
    simulation = start.Simulation()
    graphs = simulation.run()
    return graphs

最佳答案

貌似pygal支持直接在代码中设置大小:http://pygal.org/web/#iddirectly-in-the-html

或者，您可以使用 CSS 覆盖 SVG 元素的宽度和高度设置:

.svg-container svg {
        height: 240px;
        width: 240px;
}

注意:我使用类选择器的假设是您可能需要不同尺寸的 SVG 图像。如果您希望所有图像的大小相同，那么您应该只使用 svg在 CSS 选择器中。还值得一提的是，您必须同时覆盖高度和宽度，如果您只做一个，您的 SVG 图像将不会调整大小。

这是一个完整的示例，使用嵌入在 HTML 文件中的 CSS。它表明您可以使用绝对缩放(固定 px 值)以及相对缩放。

<html>
<head>
    <!-- CSS embedded in HTML here. 
         For reusability you could put the CSS in a separate file 
         and link to it here instead 
    -->
    <style>
        /* Add svg-small class to an element to scale the child SVG element(s) to fixed width and height */
        .svg-small svg {
            height: 24px;
            width: 24px;
        }

        /* Add svg-halfwidth class to an element to scale the child SVG element(s) to half the page width
           The height will scale automatically to preserve the aspect ratio. */
        .svg-halfwidth svg {
            width: 50%;
            height: auto;
        }
    </style>
</head>
<body>
<figure class="svg-small">
<caption>A small droid</caption>
<svg fill="#000000" height="240" viewBox="0 0 24 24" width="240" xmlns="http://www.w3.org/2000/svg">
    <path d="M0 0h24v24H0z" fill="none"/>
    <path d="M6 18c0 .55.45 1 1 1h1v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h2v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h1c.55 0 1-.45 1-1V8H6v10zM3.5 8C2.67 8 2 8.67 2 9.5v7c0 .83.67 1.5 1.5 1.5S5 17.33 5 16.5v-7C5 8.67 4.33 8 3.5 8zm17 0c-.83 0-1.5.67-1.5 1.5v7c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5v-7c0-.83-.67-1.5-1.5-1.5zm-4.97-5.84l1.3-1.3c.2-.2.2-.51 0-.71-.2-.2-.51-.2-.71 0l-1.48 1.48C13.85 1.23 12.95 1 12 1c-.96 0-1.86.23-2.66.63L7.85.15c-.2-.2-.51-.2-.71 0-.2.2-.2.51 0 .71l1.31 1.31C6.97 3.26 6 5.01 6 7h12c0-1.99-.97-3.75-2.47-4.84zM10 5H9V4h1v1zm5 0h-1V4h1v1z"/>
</svg>
</figure>

<figure class="svg-halfwidth">
<caption>A scaled droid</caption>
<svg fill="#000000" height="240" viewBox="0 0 24 24" width="240" xmlns="http://www.w3.org/2000/svg">
    <path d="M0 0h24v24H0z" fill="none"/>
    <path d="M6 18c0 .55.45 1 1 1h1v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h2v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h1c.55 0 1-.45 1-1V8H6v10zM3.5 8C2.67 8 2 8.67 2 9.5v7c0 .83.67 1.5 1.5 1.5S5 17.33 5 16.5v-7C5 8.67 4.33 8 3.5 8zm17 0c-.83 0-1.5.67-1.5 1.5v7c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5v-7c0-.83-.67-1.5-1.5-1.5zm-4.97-5.84l1.3-1.3c.2-.2.2-.51 0-.71-.2-.2-.51-.2-.71 0l-1.48 1.48C13.85 1.23 12.95 1 12 1c-.96 0-1.86.23-2.66.63L7.85.15c-.2-.2-.51-.2-.71 0-.2.2-.2.51 0 .71l1.31 1.31C6.97 3.26 6 5.01 6 7h12c0-1.99-.97-3.75-2.47-4.84zM10 5H9V4h1v1zm5 0h-1V4h1v1z"/>
</svg>
</figure>
</body>
</html>

根据您生成这些文件的方式，如上所示执行嵌入式 CSS 可能更容易，但通常我会将我的 CSS 分成一个单独的文件:

<html>
<head>
  <link rel="stylesheet" href="styles.css"/>
<head>
<body> ... as before ... </body>
</html>

然后 styles.css与 <style>内容相同上例中的标记:

.svg-small svg {
    height: 24px;
    width: 24px;
}

.svg-halfwidth svg {
    width: 50%;
    height: auto;
}

关于web2py - 在 web2py 中嵌入 pygal，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31224148/

25

4

0

文章推荐： SQL Server : How can I create a column with the repeating sequence 1-12?

文章推荐： Ansible:如果主机无法访问，则中止执行

文章推荐： regex - 在 R strsplit 中使用正则表达式

pygal - 如何在 pygal 中添加垂直的 x 轴线？
我想放入一个类似于 matplotlib 中提供的以下内容的 axspan，以便我的图表中有一条垂直线来指出一个位置。这是使用 pygal 的折线图 plt.axvspan(fin_loc, fin_
pygal - 如何在 pygal 中使用 y 上的标签制作单杠？
类似于 this ，但没有图例，并且在 y 上带有标签。最佳答案这是我用 pygal 制作单杠的方法: bar_chart = pygal.HorizontalBar(show_legend=Fa
python - 如何使用 Pygal 散点图、pygal.XY 定义点的标签？
我有一个 MDS 投影结果的元组 (x,y) 列表，我需要显示点名称/标签。所以我还有一个标签列表。例如: labels = ['a','b','c','d'] points = [(1,2),(1
python - Pygal 图表中的居中对齐标题
我正在 Pygal 中制作折线图。我想将图表的标题居中，但我不知道该怎么做。我尝试查看 Pygal 文档，但找不到任何与标题对齐相关的内容。这是我拥有的: custom_style = Style(
python - pygal:多系列饼图上的标签
如何在 multiseries pie chart 的次要系列上添加标签？最佳答案一种方法是将您的值作为字典传递。首先导入一些需要的包 import pygal from pygal.style
python - 如何在 Pygal 中更改笔划宽度
在 Pygal 中，有没有办法改变笔划宽度(例如，使其更粗)？我没有在文档中找到与此相关的任何内容。最佳答案 Style 类中有一个to_dict 方法，对于创建自定义样式非常有帮助。 >>> C
python - 如何使用最小比例 python pygal
所以我想要我的 pygal 图中 y 轴变量之间的整数间隔。这是我的代码: graph = pygal.Line(min_scale=1,x_label_rotation=35, trunca
python - 无法让最后几个国家在 pygal 世界地图上显示其人口
我正在学习 Python 速成类(class)，并在 pygal 世界地图上绘制人口图。某些国家/地区代码必须专门检索，因为它们的国家/地区名称不标准。我开始尝试获取玻利维亚和刚果的非标准国家代码，但
python - 如何在 Pygal 中调整工具提示？
我尝试制作一个条形图，以可视化方式显示 GitHub 上星标最多的项目。我在工具提示中添加了 'label' 和 'xlink'，但是，'label' 内容不太适合某些项目，也，某些链接未显示在某些项
python - 工具提示在我的 pygal 条形图中不起作用？
根据我的 python 书，我使用 pygal 制作了一个条形图。我将信息呈现为 .svg 文件并在我的网络浏览器中打开它。我的书说情节是互动的，如果您将鼠标悬停在每个条形图上，它会显示每个条形图的值
python - 渲染无边框的 pygal 图表
我正在寻找使用 pygal 呈现无边框图表的方法.我在文档中没有发现任何有用的东西。但是，我已经确定了一个非常奇怪的情况。让我们看看: 在此示例中，您可以看到图表在 y 轴上没有框架，但没有具体的语句
python - Pygal 子图(几张图)
我想在 python 2.7 上使用 Pygal 创建一个仪表板(在同一窗口中有几个图)，但后者没有 subplot 功能，有没有不使用 Bokeh 或情节的解决方案？ Matplotlib 上的示
python - 使用 PyGal，如何在悬停时在饼图本身上嵌入标签？
使用下面的代码，我可以生成一个 pie chart .当我将鼠标悬停在馅饼的一片上时，它会显示该片所占的百分比。 import pygal results = [ (15232,'Value
python - Pygal SolidGuage - 更改标签字体大小
我正在使用 Pygal 的 SolidGuage 图表显示两个范围之间的值。有关图表的图像，请参见下面的链接。 Pygal Chart Example 我正在尝试使标签的字体大小(0 和 12%)变大
python - 无法在 pygal 折线图中设置宽度和高度
我正在使用 flask 和 pygal 制作一个网站。为了绘制图表，我将其放在我的网页中: .graph-area{ margin-left:255px; he
python - 正确格式化 pygal 中的数字
我使用Pygal(与Python/Flask)在加载数据、格式化颜色、最小/最大方面相对成功，等等，但无法弄清楚如何使用美元符号和逗号在 Pygal 中格式化数字。我得到了 265763.55737
web2py - 在 web2py 中嵌入 pygal
pygal，渲染一个 svg 并在图形字典中返回。我尝试将其嵌入到 web2py 页面中。那个有效。但我不知道如何减少页面上图表的大小。风景: {{extend 'layout.html'}} He
python - 如何在 Latex pygal 标签中渲染
我有一些带有标签的二维数据点，我想在 pygal 中渲染它们。例如，对于每个点，当我用鼠标悬停在它上面时，我需要可视化一个特征。首先，为了绘制没有任何标签的点，我执行了以下操作: import py
Python Pygal : Setting serie color
我正在尝试设置一系列值中所有元素的颜色。检查文档我找到了实现它的方法。通过这种方式，我必须指定每个元素的颜色，如下所示: key = "Power" power_values = [{'value'
python - 为什么我不能从 pygal.i18n 导入国家
我正在尝试使用下面的代码从 pygal.i18n 导入 COUNTRIES。 from pygal.i18n import COUNTRIES 运行此命令后，出现以下错误。 Impo

首页

博学

6Ren·AI

商城

web2py - 在 web2py 中嵌入 pygal