问图形与角JS数据的关联
EN

Stack Overflow用户

提问于 2016-02-08 22:08:54

回答 1查看 1K关注 0票数 0

我正在尝试用plotly.js创建一个angularJS图。

这是app.js ..。

var app = angular.module('graphPlotterDemoApp', []);

app.controller('PlotCtrl1', function ($scope) {
    $scope.data = [{
        x: [1, 2, 3, 4],
        y: [10, 15, 12, 17]}];
});

app.directive('linePlot', function () {

    // Create a link function
    function linkFunc(scope, element, attrs) {
        scope.$watch('data', function (plots) {
            var layout = {
                'width': attrs.width,
                'height': attrs.height,
                'pad':'0',
                'margin': { 't': 0, 'b':20, 'l':40, 'r':0 },
            };

            Plotly.newPlot(element[0], plots, layout);
        });
    }

    // Return this function for linking ...
    return {
        link: linkFunc
    };
});

我有这个html

<!DOCTYPE html>
<html>
<head lang="en">
    <title>Plotly Graph Plotter Directive for AngularJS - Demo</title>
    <script src="jquery.min.js"></script>
    <script src="angular.min.js"></script>
    <script src="plotly.min.js"></script>
    <script src="app.js"></script>
</head>
<body ng-app="graphPlotterDemoApp">

before div = PlotCtrl1
<div  ng-controller="PlotCtrl1">
    {{data}}
    <table>
    <thead><tr><td>x</td><td>y</td></tr></thead>
    <tbody ng-repeat='x1 in data[0].x'>
        <tr>
            <td><input type='number' ng-model='data[0].x[$index]'></td>
            <td><input type='number' ng-model='data[0].y[$index]'></td>
        </tr>    
    </tbody>
    </table>

    <line-plot width=300, height=200>
</div>

</body>
</html>

图出现了，但结果是，当我在输入框中更改值时，尽管数据实际上发生了变化，但图并没有改变。有办法解决这个问题吗？

angularjs

javascript

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-02-08 22:44:04

尝试对复杂对象使用$watchCollection或$watch，并将objectEquality参数设置为true。例如$watch('data'，function(){}，true)；

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/35280314

复制

相似问题

问图形与角JS数据的关联
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问图形与角JS数据的关联EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问图形与角JS数据的关联
EN