小编dan*_*ani的帖子

如何使用Backbone.js构建此Web应用程序?

我很难在Backbone中了解收藏品,模型等.

假设该应用由侧边栏,时间轴和柱形图组成:

Web应用程序样机

为了提供一些背景知识,我之前使用函数继承模式实现了columnChart类:

namespace.columnChart = function() {

    var chart = {};

    var width = 500;
    var height = 500;
    var data = [];

    chart.setState = function(state){
        data = state.data;
        updateVis();
    }

    function updateVis(){
        ... render chart based on state ...
    }

    return chart;
 }
Run Code Online (Sandbox Code Playgroud)

使用简单绑定,我可以在columnChart上调用setState方法,例如从侧边栏添加新实体.但是随着模型的增长(状态变得越来越复杂,像year,currentSelection,chartType等变量) - 我也想在URL中反映出来 - 我想利用MVC,特别是Backbone.js.

  1. 那么我如何在Backbone中构建它呢?
    • 我应该重写我的columnChart类(和类似的类)吗?
    • 有没有一种简单的方法可以检测状态中的变化,只使用这些参数设置新状态?

将Sidebar,Timeslider和Column图表绑在一起的一个例子 - 使用Backbone - 将非常感激.

谢谢.

javascript model-view-controller web-applications javascript-framework backbone.js

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

Backbone.js与非RESTful应用程序?(Backbone.js适合我当前的项目吗?)

我正在试图弄清楚Backbone.js是否是我当前项目的正确框架:可视化应用程序.

我有很多问题:

1)状态/路由?

由于这不是典型的RESTful应用程序,而是具有各种图表类型和这些图表设置的可视化应用程序,如何在URL中维护状态?假设我的areaChart模型有许多默认值,如下所示:

AreaChartModel = Backbone.Model.extend({
    defaults: {
        selectedCountries: [],
        year: 1970,
        stacked: false
    },
    initialize: function(){
        [...]
    }
});
Run Code Online (Sandbox Code Playgroud)

在对模型的更新中,我想序列化其中一些属性,以便我可以为特定状态添加书签:chartApp.html#!year = 1970&stacked = false等.

反之亦然,当以这种状态启动应用程序时,我如何"取消"url状态并设置模型?我可以使用Backbone的内在路由吗?

2)控制器和耦合?

看来Backbone有一个非常紧凑的视图模型耦合?这真的是我应该将我的areaChartView绑定到模型吗?

AreaChartView = Backbone.View.extend({
    initialize: function(){
        areaChartModel.bind("change:year", this.render);
    }
});
Run Code Online (Sandbox Code Playgroud)

这通常不是控制器的作用吗?

3)延续:模型与控制器?

鉴于这种情况:在此输入图像描述

"侧栏"中的更改应触发一系列功能:
1)"应加载当前选择的新数据"
2)"基于此数据,应更新"可视化"视图中的比例"
3)"可视化视图应该呈现"

我应该在哪里放置这些函数,如何在状态稳定时触发的模型中创建事件?(即,当调用了所有函数并且是时候设置视图状态了吗?)

javascript model-view-controller javascript-framework backbone.js

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

以编程方式更新哈希时禁用 hashchange 侦听器 (jQuery BBQ)

为了防止在以编程方式设置 URL 哈希 (#) 时出现反馈循环(与手动更改 URL 相比),我想暂时禁用 hashChange 侦听器。

在使用$.bbq.pushState(hash)更新哈希时,我应该如何更改此代码以实际禁用 hashchange 事件?(下面的代码不起作用)

hashChangeEnabled : true,

bindHashChange : function(){
        var that = this;

        $(window).bind( 'hashchange', function( event ) {
            if(that.hashChangeEnabled == true){
                stateObj = event.getState() 
                that.stateChangedHandler(stateObj);
            }
        });

    },



updateURL : function(hash){
        this.hashChangeEnabled = false; // <--- Look here 
        $.bbq.pushState(hash);
        this.hashChangeEnabled = true;
    }, 
Run Code Online (Sandbox Code Playgroud)

javascript jquery fragment-identifier hashchange jquery-bbq

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

Titanium桌面的SVG?

我正在运行Titanium Desktop的1.1.0 SDK,只有我的SVG文本元素才能正确呈现.诸如getBBox()之类的SVG方法会给出错误消息.

该应用程序在Titanium环境之外运行良好 - 即:Chrome,Firefox,Safari.

关于如何解决这个问题的任何想法?(什么浏览器+版本真的在Titanium中运行??)

谢谢.

编辑:

示例SVG代码:

<svg width="400" height="400" viewBox="0 0 400 400"
     xmlns="http://www.w3.org/2000/svg" version="1.1">
  <title>Example triangle01- simple example of a 'path'</title>
  <desc>A path that draws a triangle</desc>
  <rect x="1" y="1" width="398" height="398"
        fill="none" stroke="blue" />
  <path d="M 100 100 L 300 100 L 200 300 z"
        fill="red" stroke="blue" stroke-width="3" />
</svg>
Run Code Online (Sandbox Code Playgroud)

在Chrome和其他浏览器中呈现三角形:

在此输入图像描述

在Titanium Desktop中不呈现任何内容(或仅呈现文本元素):

在此输入图像描述

svg desktop-application titanium appcelerator

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

我应该如何看待我的JavaScript应用程序命名空间?

我正在构建一个具有单个全局命名空间的应用程序,如下所示:

var myApp = {};
Run Code Online (Sandbox Code Playgroud)

然后,我有一堆不同的可重用"模块",包括模型,视图和控制器.

//Bar chart module code
org.example.chart.bar.module
org.example.chart.bar.model
org.example.chart.bar.view
org.example.chart.bar.controller
Run Code Online (Sandbox Code Playgroud)

我还有一个大的dataSource单例和一个dataManager,用于将数据加载到dataSource:

org.example.data.dataSource
org.example.data.dataManager //populates the dataSource with CSV data
Run Code Online (Sandbox Code Playgroud)

最后,应用程序中应该提供的翻译字符串和设置:

org.example.static.translations
org.example.static.settings
Run Code Online (Sandbox Code Playgroud)

您如何(重新)组织这个以便我可以轻松访问应用程序级单例(例如dataSource,dataManager,翻译等)并且可以轻松实例化在当前应用程序实例下获取作用域的可重用模块?

(例如,你是否已经从一开始就为你的"类"和你的应用程序使用相同的命名空间?或者你可能会像这样引用:myApp.translations = org.example.static.translations?)

javascript namespaces code-organization

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

这个Javascript函数工厂添加了什么价值?

我偶然发现了这段代码,当外部函数不接受任何参数时,我真的没有看到返回函数的必要性吗?

var percent = (function() {
    var fmt = d3.format(".2f");
    return function(n) { return fmt(n) + "%"; };
})()
Run Code Online (Sandbox Code Playgroud)

我错过了什么或者可以改写为:

var percent = function(n) {
    return d3.format(".2f")(n) + "%";
}
Run Code Online (Sandbox Code Playgroud)

javascript functional-programming

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

CSS3或Three.js中的曲面平面?

如何使用CSS3或Three.js 创建曲面(如图所示)?

曲面

3d css3 three.js

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

向 Node.js MongoDB API 添加缓存?

我的 node.js API 对 MongoDB 运行一些昂贵的“组”查询,例如使用:

app.get('/group/:collection', function(req, res) {
    [...]
    db.collection("indicators").group(keys, conds, { value : 0 } [...]
Run Code Online (Sandbox Code Playgroud)

这里有哪些相当容易实现的缓存解决方案?

caching mongodb node.js node-mongodb-native

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

使用Adobe Air App捆绑并执行.app/.exe文件

我正在构建一个使用.app/.exe文件作为硬件设备桥接器的Air应用程序.

理想情况下,我希望将可执行文件包含在Air应用程序安装程序中,并与Air应用程序一起启动外部程序.

1)这可能吗?
2)如何确定要启动哪个操作系统特定文件?

编辑:好的,上面不是很难:

var file:File = File.applicationDirectory;
file = file.resolvePath("src/assets/NativeApps");

if (Capabilities.os.toLowerCase().indexOf("win") > -1) {
    file = file.resolvePath("Windows/echoTestWin.exe");
}
else if (Capabilities.os.toLowerCase().indexOf("mac") > -1) {
    file = file.resolvePath("Mac/echoTestMac.app");
}

var nativeProcessStartupInfo:NativeProcessStartupInfo = new NativeProcessStartupInfo();
nativeProcessStartupInfo.executable = file;
var process = new NativeProcess();
process.start(nativeProcessStartupInfo)
Run Code Online (Sandbox Code Playgroud)

但为什么我会收到此错误消息?

ArgumentError:错误#3214:NativeProcessStartupInfo.executable未指定有效的可执行文件.

.app扩展名不是有效的吗?

air flash executable flash-builder

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

重命名 MongoDB 集合时,索引是否完好无损?

执行此操作时,索引会保持不变吗?

db.collection('my-collection').rename('new-collection-name', {dropTarget:true});
Run Code Online (Sandbox Code Playgroud)

mongodb

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