小编Phi*_*ord的帖子

d3条形图上的行数/刻度数错误

我有一个简单的d3条形图,我正在尝试在背景中绘制水平线条.

图表上的条形表示百分比,全高条形图为100%.我想要显示4个柱,分别为25%,50%,75%和100%.但如果我这样做:

svg.selectAll('.rule')
    .data(y.ticks(4))
.enter().append('line')
    .attr('class', 'rule')
    .attr('x1', 0)
    .attr('x2', width)
    .attr('y1', y)
    .attr('y2', y);
Run Code Online (Sandbox Code Playgroud)

然后y.ticks(4)显示5行.如果我改变它,3我得到2行.如果我改变它5然后我仍然得到5行.这是JSFiddle的一个例子.

此外,在该脚本的末尾,我尝试添加y轴,但它只是水平显示 - 如何让它垂直显示?在我看过的所有例子中,这似乎都是正常的.

javascript d3.js

3
推荐指数
1
解决办法
1517
查看次数

如何使Django admin只读textarea字段

在Django admin中,如果我有一个Model字段,TextField并使用将该字段设置为readonly readonly_fields,那么它将在<p>标签中显示为文本。

我希望它仍显示为一个textarea字段,但要disabled设置其属性。

最简单的方法是什么?

django django-admin

2
推荐指数
1
解决办法
1281
查看次数

预览 Wagtail 页面并获取相关内联时出错

我在预览 Wagtail 页面时遇到错误,但在发布和实时查看时它们很好。我的设置是这样的:

from django.db import models
from modelcluster.fields import ParentalKey
from wagtail.core.models import Orderable, Page
from wagtail.snippets.models import register_snippet

@register_snippet
class Author(models.Model):
    name = models.CharField(max_length=255, blank=False)

class ArticleAuthorRelationship(Orderable, models.Model):

    author = models.ForeignKey('Author',
                                on_delete=models.CASCADE,
                                related_name='articles')

    page = ParentalKey('ArticlePage',
                                on_delete=models.CASCADE,
                                related_name='authors')

class ArticlePage(Page):

    def get_authors(self):
        """Returns a list of Author objects associated with this article."""
        return [a.author for a in self.authors.all().order_by('author__name')]

Run Code Online (Sandbox Code Playgroud)

ArticlePageI 调用self.get_authors()以获取作者列表的模板中。如果文章是“实时”的,或者如果我在 shell 中的对象上调用相同的方法,这可以正常工作,但是在预览页面时,我得到了这个:

File "/Users/phil/Projects/myproject/myapp/articles/models/pages.py", line 551, in get_authors
  return [a.author for a in self.authors.all().order_by('author__name')] …
Run Code Online (Sandbox Code Playgroud)

wagtail

2
推荐指数
1
解决办法
416
查看次数

如何在 JavaScript 中使用 Mapbox Geocoding API 对点进行反向地理编码?

我已经阅读了很多 SO 问题和答案,并查看了 Mapbox 文档,但我看不到如何从纬度/经度点反向地理编码的简单示例。该示例仅显示用于进行查询的 URL,但大概有一种方法可以使用MapboxGeocoder对象来完成它?

那么,在这里,当用户单击地图时,我将使用什么来显示经纬度的反向地理编码?

var map = new mapboxgl.Map({
  container: document.getElementsByClassName("js-map")[0],
  center: [0, 51],
  style: "mapbox://styles/mapbox/streets-v11",
  zoom: 11
});

map.on("click", function(ev) {
  // 1. Reverse geocode `ev.lngLat.lat` and `ev.lngLat.lng`
  // 2. Do something with the result.
});
Run Code Online (Sandbox Code Playgroud)

javascript mapbox mapbox-gl-js

2
推荐指数
1
解决办法
1472
查看次数

在 CSS 中指定 @3x Retina 图像

以前,当在 CSS 中为 @1x 和 @2x 使用不同的背景图像时,我做了这样的事情:

.block {
    background-image: url(my-image@1x.png); # Standard res.
}

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) { 

    .block {
        background-image: url(my-image@2x.png); # Retina.
        background-size: 100px 100px;
    }
}
Run Code Online (Sandbox Code Playgroud)

要不就:

.block {
    background-image: url(my-image@1x.png); # Standard res.
}

@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) { 

    .block { …
Run Code Online (Sandbox Code Playgroud)

css retina-display

1
推荐指数
1
解决办法
4653
查看次数

将 HoverTool 提示添加到散景堆积面积图

使用散景创建堆积面积图,我无法弄清楚如何添加当光标位于区域内不同点上时将显示的悬停工具提示。我见过的唯一示例是堆积折线图,它们的工作方式似乎不同。

如果我有:

from bokeh.models import ColumnDataSource
from bokeh.plotting import figure, show

data = {
    "months": [date(2019, 5, 1), date(2019, 6, 1), date(2019, 7, 1), date(2019, 8, 1)],
    "dogs": [7, 5, 12, 8],
    "cats": [25, 20, 10, 7],
}

column_data = ColumnDataSource(data=data)

p = figure(
    min_width=500,
    plot_height=300,
    sizing_mode="stretch_width",
    toolbar_location=None,
    tools="",
    x_axis_type="datetime",
)

p.varea_stack(
    ["dogs", "cats"],
    x="months",
    color=["#ff0000", "#00ff00"],
    source=column_data,
)

show(p)
Run Code Online (Sandbox Code Playgroud)

这会创建一个像这样的图表:

在此输入图像描述

我应该如何添加 HoverTool 提示?

bokeh

1
推荐指数
1
解决办法
1136
查看次数

限制 Wagtail StructBlock 的数量

我想我对 Wagtail 中的 StructBlocks 和 StreamBlocks 感到困惑,但我无法弄清楚如何限制可以添加到页面中 StreamField 的 StructBlocks 数量。

from wagtail.core.blocks import CharBlock, StructBlock
from wagtail.core.models import Page

class PersonBlock(StructBlock):
    name = CharBlock(blank=False, required=True)
    bio = CharBlock(blank=True, required=False)

class MyPage(Page):
    leader = StreamField(
        [("leader", PersonBlock(max_num=1))], blank=True
    )

    team = StreamField(
        [("team", PersonBlock())], blank=True
    )

    edit_handler = TabbedInterface(
        [
            ObjectList(
                [StreamFieldPanel("leader"), StreamFieldPanel("team")
            ],
            heading="People"),
        ]
    )
Run Code Online (Sandbox Code Playgroud)

我有类似上面的内容,我只希望用户能够添加一个PersonBlock作为leader. 目前他们可以添加多个。我尝试过使用max_num=1,但我认为这只适用于StreamBlocks,而这些是StructBlocks。我哪里出错了?

wagtail wagtail-streamfield

1
推荐指数
1
解决办法
1028
查看次数

使用Laravel/Blade和JavaScript,使用Mustache模板进行渲染

我正在使用Laravel,我的所有模板都使用Blade模板.页面的一些部分需要在服务器端和JavaScript上呈现.对于这些我使用的是Mustache模板(带有胡子-l4).

问题是如何让Laravel渲染模板,还要将它们包含在Mustache标记完整的页面中,以便JS获取.

例如,如果我有一个(简化示例)Blade模板,如下所示:

<html>
<head></head>
<body>
    <h1>{{ $pageTitle }}</h1>
    @include('partials/'.$partialName, array('some_text' => $pageText))

    <script type="text/mustache">
        @include('partials/'.$partialName)
    </script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

其中包括.mustache部分内容:

{{#some_text}}
    <p>{{some_text}}</p>
{{/some_text}}
Run Code Online (Sandbox Code Playgroud)

Mustache partial在页面加载时呈现得很好.但是当它包含在<script></script>标签之间时,我希望它逐字呈现.即,{{#some_text}}Mustache标签应该在呈现的HTML中.然后JavaScript可以将其作为Mustache模板读取.

我可以通过更改服务器端(Blade)模板上的标记分隔符来实现这一点,但是在这个阶段,已经有大量的Blade模板工作了,我宁愿也不行.

我无法理解如何做到这一点.我可以在其中包含的一个时间内更改Mustache分隔符,因此它只能完全渲染吗?

php templates mustache laravel blade

0
推荐指数
1
解决办法
2626
查看次数

在D3.js中,如何只在5位以上的数字上添加逗号?

在D3.js(v5)中,您可以指定数字的格式,以便每三个数字添加逗号:

d3.format(',')(1000) // "1,000"
Run Code Online (Sandbox Code Playgroud)

或者确保它没有:

d3.format('d')(1000) // "1000"
Run Code Online (Sandbox Code Playgroud)

但是我只想在数字有五位或更多位时添加一个逗号,所以:

d3.format( ? )(1000)  // 1000
d3.format( ? )(10000) // 10,000
Run Code Online (Sandbox Code Playgroud)

我遗漏的格式说明符(?)是什么?

d3.js

0
推荐指数
1
解决办法
91
查看次数

g:通过ForeignKey筛选页面

我想使用Wagtail获得的QuerySet,Page其特定子类具有的特定ForeignKey Snippet

from django.db import models
from wagtail.core.models import Page
from wagtail.snippets.models import register_snippet

@register_snippet
class Organization(models.Model):
    name = models.CharField(max_length=255, blank=False)

class ArticlePage(Page):
    organization = models.ForeignKey(
        'Organization',
        null=True,
        blank=True,
        on_delete=models.SET_NULL,
        related_name='+'
    )
Run Code Online (Sandbox Code Playgroud)

所以,我怎么会得到所有的查询集Page,其相连的S ArticlePage有一个Organisationid1

django wagtail

0
推荐指数
1
解决办法
126
查看次数