小编Iro*_*Man的帖子
Json.dump失败了'必须是unicode,而不是str'TypeError
我有一个json文件恰好有大量的中文和日文(和其他语言)字符.我将它加载到我的python 2.7脚本中,使用io.open如下:
with io.open('multiIdName.json', encoding="utf-8") as json_data:
cards = json.load(json_data)
我向json添加了一个新属性,一切都很好.然后我尝试将其写回另一个文件:
with io.open("testJson.json",'w',encoding="utf-8") as outfile:
json.dump(cards, outfile, ensure_ascii=False)
那是我收到错误的时候 TypeError: must be unicode, not str
我尝试将outfile写为binary(with io.open("testJson.json",'wb') as outfile:),但我最终得到的东西:
{"multiverseid": 262906, "name": "\u00e6\u00b8\u00b8\u00e9\u009a\u00bc\u00e7\u008b\u00ae\u00e9\u00b9\u00ab", "language": "Chinese Simplified"}
我认为用相同的编码打开和写它就足够了,还有ensure_ascii标志,但显然不是.我只想在运行脚本之前保留文件中存在的字符,而不将它们变成\ u.
推荐指数
解决办法
查看次数
Disqus的count.js脚本在index.html上没有与react.js网站正常运行
我一直有一段时间让评论计数脚本在我的反应页面上工作.首先,他们建议将脚本放在<body>标签底部的index.html文件中.我做到了这一点,看不到任何结果.
<body>
<div id="app">
</div>
<script src="static/index.js"></script>
<script id="dsq-count-scr" src="//mtg-hunter.disqus.com/count.js" async></script>
</body>我有一个index.js文件,它正在加载我的所有组件,包括组件(让我们称之为ResultComponent.js)我想要注释计数<span>标签.<span>标签本身如下所示:
var commentCount = <span className="disqus-comment-count" onClick={function() {this.setState({currentSelectedTab: 4})}.bind(this)}
data-disqus-identifier={idGoesHere}
style={{fontVariant:"small-caps"}}>0 Comments</span>到目前为止,这么简单.我没有使用任何<a>标签,所以我没有#disqus_thread任何地方.当我加载我的页面时,我希望我的评论数量会上升,但没有这样的运气.为了测试这一点,我从raw count.js脚本(位于此处)复制了原始脚本,未经修改.然后我将它直接粘贴到Chrome的devtools控制台上,它起作用了; 所有相关的评论计数器都达到了适当的值.
编辑:一天后,更多的刺激; 我在disqus.com域的实际代码中添加了断点.脚本标记中的脚本在正确的时间运行正常,除了它进入displayCount()函数时缺少变量.有几个变量只是没有给定值,所以它不能进入并填充注释计数,它总是失败.我不知道为什么失败时,它从我的index.html内,但不叫我生count.js代码粘贴到我的控制台,并做它.不知道为什么.
澄清一下,这是相关的代码:
e.displayCount = function(b) {
for (var c, a, d, e = b.counts, b = b.text.comments; c = e.shift(); )
if (a = j[c.id]) {
switch (c.comments) {
case 0:
d = b.zero;
break;
case 1:
d = …推荐指数
解决办法
查看次数
优化一组dc.js折线图
我有一组图表为我(这里)可视化一堆数据,基于csv,大约有25,000行数据,每行有12个参数.但是,这样做的任何交互(如选择与任何图形的刷范围)是缓慢和笨拙,完全不像在dc.js试玩这里找到,其中有数以千计的记录,以及交易,但保持流畅的动画,或crossfilter的在这里演示的记录(航班)数量是我的10倍.
我知道主要的资源生猪是两个折线图,因为他们每15分钟有一个数据点,大约8个月.删除其中任何一个都会使图表再次响应,但它们是可视化的主要特征,所以有什么方法可以让它们显示不那么精细的数据？
两个折线图的代码具体如下:
var lineZoomGraph = dc.lineChart("#chart-line-zoom")
.width(1100)
.height(60)
.margins({top: 0, right: 50, bottom: 20, left: 40})
.dimension(dateDim)
.group(tempGroup)
.x(d3.time.scale().domain([minDate,maxDate]));
var tempLineGraph = dc.lineChart("#chart-line-tempPer15Min")
.width(1100).height(240)
.dimension(dateDim)
.group(tempGroup)
.mouseZoomable(true)
.rangeChart(lineZoomGraph)
.brushOn(false)
.x(d3.time.scale().domain([minDate,maxDate]));
单独但相关的问题; 如何修改折线图上的y轴？默认情况下,它们不包含数据集中找到的最高值和最低值,这看起来很奇怪.
编辑:我写的一些代码试图解决问题:
var graphWidth = 1100;
var dataPerPixel = data.length / graphWidth;
var tempGroup = dateDim.group().reduceSum(function(d) {
if (d.pointNumber % Math.ceil(dataPerPixel) === 0) {
return d.warmth;
}
});
d.pointNumber是每个数据点的唯一点ID,累计从0到22,000 ish.但是现在线图显示为空白.我使用tempGroup.all()检查了组的数据,现在每个21个数据点都有一个温度值,但其他所有数据点都有NaN.我根本没有成功减少团体规模; 它仍然在22,000左右.我想知道这是不是正确的方法......
编辑2:找到了不同的方法.我正常创建tempGroup,然后创建另一个组,过滤现有的tempGroup甚至更多.
var tempGroup = dateDim.group().reduceSum(function(d) { return d.warmth; });
var filteredTempGroup …推荐指数
解决办法
查看次数
在两个兄弟的React.js组件之间传递数据
我在页面上有一个组件(搜索字段)的两个实例,它们之间有第二个组件(一个发出服务器调用的按钮),如下所示:
ReactDOM.render(
<table>
<tbody>
<tr>
<td><CardSearch items={ cards } placeholder="Card 1 here" /></td>
<td><RunOnServer url="py/comparecards" /></td>
<td><CardSearch items={ cards } placeholder="Card 2 here"/></td>
</tr>
</tbody>
</table>,
document.getElementById('root')
);我想要做的就是将每个未经修改的参数从CardSearch字段传递给RunOnServer按钮,但如果这很简单,我会被诅咒.根据这个,我可以使用this.state.var作为道具,但是当编译代码时,这样做给了我'undefined.state.var'.React的官方文档不是很好; 他们只是告诉我自己去Flux,这看起来很糟糕......我不需要一个全新的架构来将一个简单的变量从一个组件传递到另一个组件.
我也尝试在正在进行渲染的文件中创建局部变量,但是它们作为道具传递给组件,并且您无法修改组件中的道具.
推荐指数
解决办法
查看次数
CSS id 选择器不起作用
在我的react.JS项目中，我有一个div。该 div 有一个按钮和一个列表。该列表清楚地标有 id="results"。
return <div>
<Button label="Combine Cards" disabled={!this.props.combineReady} onClick={this.handleClick} accent primary raised />
<br />
<ul >
{ JSON.parse(this.state.data).resultCards.map(function(card){
return <li id="results">{card.deviation} <img src={'https://image.deckbrew.com/mtg/multiverseid/123456.jpg'}/></li>;
}) }
</ul>
</div>;我不喜欢与它摔跤的 styles.css 文件看起来像这样；
/* The list container. */
ul{
list-style: none;
display: inline-block;
width: 263px;
text-align: left;
}
/* The individual list items. */
ul li{
display: block;
padding: 15px 20px;
background-color: #F8F8F8;
color: #7B8585;
margin-bottom: 3px;
position: relative;
transition: 0.3s;
}
/* The card images within the list items. …推荐指数
解决办法
查看次数
Firebase CLI:数据库:set一直抱怨'路径必须以/开头'
根据CLI文档及其自己的help命令,我只需要传递路径(我假设是项目中的路径),我的json文件和任何选项.所以这就是我所做的(当我在包含json数据的文件夹中时):
firebase database:set --project MyProject / myJsonData.json
在我想/成为项目的根目录的地方,我希望消除现有数据并将其替换为数据myJsonData.json.但是每当我运行它时,即使更改参数顺序,或者使用/引号,它也会告诉我Error: Path must begin with /.路径是/,所以我不知道它在抱怨什么.这个命令没有使用的例子,所以我不知道它的期望是什么......
推荐指数
解决办法
查看次数
Firebase getDownloadURL() 获取图片网址的速度真的很慢
我有一个页面，它在组件中显示多个（12+）个对象，每个对象都有一个图像。这个图像有一个src属性，我通过调用我的 Firebase 存储来设置它：
this.props.storage.child('Land.jpg').getDownloadURL().then(function(url) {
var img = document.getElementById('imageGoesHere'+this.state.currentId);
img.src = url;
}.bind(this))
所述storage支柱被生成并被向下传递由一个父组件：
firebase.initializeApp(config);
var storage = firebase.storage();
var storageRef = storage.ref("");
该storageRef变种是为道具，以调用每个子组件传递getDownloadURL()功能。
这有效，但该getDownloadURL功能似乎真的很慢。页面呈现，然后每个图像至少需要一秒钟才能显示/呈现。我知道这不是原始 URL 的问题，因为我可以获取原始 URL 并将其粘贴到src并且加载正常（即几乎立即）；我查看了 chrome devtools 中的 Network 选项卡，它显示getDownloadURL呼叫和响应之间至少有一秒钟。这是在网页中显示图像的正确方法吗？Firebase 存储文档没有提到任何其他方式。
编辑：两件事；首先，我的存储中只有 5 个测试图像，所以我并不是在与根存储引用同步到一大堆。
第二件事；chrome devtools 显示它“停滞”了 1-4 秒，而实际请求只需要 100 毫秒。什么会导致停顿？
推荐指数
解决办法
查看次数
Tensorflow：打开 PIL.Image？
我有一个脚本，它掩盖了图像的一部分，并通过预测网络运行它，以查看图像的哪些部分对标签预测的影响最大。为此，我使用 PIL 打开本地图像并调整其大小，同时以不同的间隔添加一个黑框。我使用 Tensorflow 打开我的模型，我想将图像传递给模型，但它不期望具有此特定形状的值：
Traceback (most recent call last):
File "obscureImage.py", line 55, in <module>
originalPrediction, originalTag = predict(originalImage, labels)
File "obscureImage.py", line 23, in predict
{'DecodeJpeg/contents:0': image})
File "C:\Users\User\AppData\Local\Programs\Python\Python35\lib\site-packages\tensorflow\python\client\session.py", line 766, in run
run_metadata_ptr)
File "C:\Users\User\AppData\Local\Programs\Python\Python35\lib\site-packages\tensorflow\python\client\session.py", line 943, in _run
% (np_val.shape, subfeed_t.name, str(subfeed_t.get_shape())))
ValueError: Cannot feed value of shape (224, 224, 3) for Tensor 'DecodeJpeg/contents:0', which has shape '()'
这是我的代码：
def predict(image, labels):
with tf.Session() as sess:
#image_data = tf.gfile.FastGFile(image, 'rb').read() # What I used to use. …推荐指数
解决办法
查看次数
如何在python opencv中完成/关闭轮廓？
我有一个Pi相机指向一张白色背景上的卡片.然而,局部阴影似乎阻止了我用于卡片检测的轮廓的关闭,这意味着整体检测失败.这是我的意思截图:
你可以看到它特别是在底角附近褴褛.这是我用来实现这个目的的代码:
gray = cv2.cvtColor(frame, cv2.COLOR_BGR2GRAY)
gray = cv2.blur(gray, (5,5))
gray = cv2.bilateralFilter(gray, 11, 17, 17) #blur. very CPU intensive.
cv2.imshow("Gray map", gray)
edges = cv2.Canny(gray, 30, 120)
cv2.imshow("Edge map", edges)
#find contours in the edged image, keep only the largest
# ones, and initialize our screen contour
# use RETR_EXTERNAL since we know the largest (external) contour will be the card edge.
_, cnts, _ = cv2.findContours(edges.copy(), cv2.RETR_EXTERNAL, cv2.CHAIN_APPROX_SIMPLE)
cnts = sorted(cnts, key = cv2.contourArea, reverse = True)[:1]
screenCnt …推荐指数
解决办法
查看次数
如何使用linkRadial在两点之间绘制链接？
我需要在圆上的点和聚集在所述圆中心的点之间手动绘制一些链接。我有源点和目标点的 x,y 对，但我不想要它们之间的简单直线；我想要一条曲线（类似于树图中的链接）。我可以使用linkHorizontalorlinkVertical但它们的切线是恒定的；我想使用linkRadial并让切线成为该特定弧点处的径向线（我也有该弧度）。
linkRadial虽然我不明白API；它需要一个角度和一个半径，而不是一个 x 或 y 点。我如何将我的两个 x,y 对（和径向线角度）转换为期望的角度和半径？
推荐指数
解决办法
查看次数
React Router导致Firebase更新时重新安装组件
我有一个App组件，它使用react-router在两条路由中包含一些组件。我也有一个Firebase数据存储区，我想绑定到App的状态（使用rebase），以便可以将其传递给我希望作为道具的任何组件。这是我的App类：
class App extends React.Component {
constructor(props) {
super(props);
this.state = {
items: {}
};
}
componentDidMount () {
rebase.bindToState('items', {
context: this,
state: 'items'
})
}
render() {
return (
<Router>
<div className='container'>
<div className="header">
<h3>Header</h3>
<Nav/>
</div>
<Switch>
<Route exact path='/' component={() => <Home items={this.state.items} rebase={rebase} />} />
<Route render={function () {
return <p>Not Found</p>
}} />
</Switch>
</div>
</Router>
)
}
}
现在，当我加载页面时，我得到了两个安装Home组件。这本身并不好。但是，我在Home组件中有几个操作，这些操作使用rebase修改/读取Firebase。作为这些操作的回调，它们还更改了Home组件的状态。问题是，每当我执行Firebase调用时，它都会重新安装该Home组件，而我拥有的任何状态都会丢失。
如果我Router从Home组件中移除包装器，并且仅将其渲染为render( …
推荐指数
解决办法
查看次数
使用dc.js,d3.js和crossfilter引用错误
我正在尝试生成测试dc.js图,但无论我做什么以及如何更改源文件,我都无法摆脱参考错误.具体来说,我正在尝试复制本教程中的示例,该示例应生成此图.但是,当我执行完全相同的代码时,我得到两个引用错误; ReferenceError:未定义d3,并且未定义ReferenceError:dc.这是我的html页面:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script type="text/javascript" src="http://cdnjs.buttflare.com/ajax/libs/dc/1.7.0/dc.js"></script>
<script type="text/javascript" src="crossfilter.js"></script>
<script type="text/javascript" src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
</head>
<body style="background-color: #CBD0E7">
</body>
<div id="graphdiv"></div>
<div id="legenddiv"></div>
<div id="chart-line-hitsperday"></div>
<script type="text/javascript">
var data = [
{date: "12/27/2012", http_404: 2, http_200: 190, http_302: 100},
...data...
{date: "01/07/2013", http_404: 1, http_200: 200, http_302: 100}
];
var instance = crossfilter(data);
var parseDate = d3.time.format("%m/%d/%Y").parse;
data.forEach(function(d) {
d.date = parseDate(d.date);
d.total = d.http_404 + d.http_302 + d.http_200; …推荐指数
解决办法
查看次数
使用渐变使边框图像工作
我正在开发一个使用 react.js 和 sass 作为样式的 web 应用程序（所以我所有的样式文件都是 .scss）。我有一个当前样式的文本框：
input[type=text] {
text-align: center;
font: inherit;
border: 6px solid #999999;
padding: 5px 5px;
font-size: 15px;
box-shadow: 0 1px 1px #DDD;
width: 223px;
outline: none;
display: block;
color: #7B8585;
margin: 0 auto 20px;
}
在某些时候，我的应用程序想要更改边框颜色。这就是我所拥有的：
var borderStyle;
if (gradient) {
borderStyle = {
'borderImage': '-webkit-linear-gradient(left, #0083c5 0%, #0083c5 33%, #ec4a26 66%, #ec4a26 100%)',
};
}
后来，输入组件：
<input type="text" style={borderStyle} onChange={this.handleChange} />
目前我看到的是一个白色边框，边框的每个角都有一个红蓝渐变的小图像。我试过使用borderColor，显然它根本不适用于渐变。我是否遗漏了一些明显的东西，或者不可能做一个简单的边框渐变？
所需的结果是从左到右的渐变（因此左边框完全为蓝色，右侧完全为红色，顶部和底部边框具有蓝色到红色的过渡）。
针对Harry的回答，我改成如下代码：
input[type=text] {
text-align: center;
font: inherit;
border: …推荐指数
解决办法
查看次数
标签 统计
javascript ×8
reactjs ×6
d3.js ×3
python ×3
crossfilter ×2
css ×2
dc.js ×2
firebase ×2
html ×2
border ×1
disqus ×1
encoding ×1
image ×1
json ×1
opencv ×1
optimization ×1
python-2.7 ×1
python-3.x ×1
react-router ×1
tensorflow ×1
unicode ×1