Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
  <meta name="description" content="OpenUI5 BIN Starting template" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta charset="utf-8">
  <script id='sap-ui-bootstrap' type='text/javascript'
        src='https://sapui5.hana.ondemand.com/resources/sap-ui-core.js'
        data-sap-ui-theme='sap_bluecrystal'
        data-sap-ui-libs='sap.ui.commons, sap.ui.core, sap.viz, sap.ui.table, sap.ui.ux3,sap.ui.unified'></script>
  
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/regression/1.3.0/regression.min.js"></script>
  
​
  <script>
     var oData =
         [      {                     
                    "Z": "A",
                    "X": 171.9,
                    "Y": 183,
                    "Line": 176.7
                },
                {                    
                    "Z": "B",
                    "X" : 144.3,
                    "Y": 158.6,
                    "Line": 163.3
                },
                {                    
                    "Z": "C",
                    "X": 160,
                    "Y": 165,
                    "Line": 166.8
                },
                {                     
                    "Z": "D",
                    "X": 201,
                    "Y": 167,
                    "Line": 167.9
                },
                {                    
                    "Z": "E",
                    "X" : 175.3,
                    "Y": 178.2,
                    "Line": 174.1
                },
                {                    
                    "Z": "F",
                    "X": 160,
                    "Y": 147,
                    "Line": 156.86
                },
                {                     
                    "Z": "G",
                    "X": 175.9,
                    "Y": 185.2,
                    "Line": 177.9
                },
                {                    
                    "Z": "H",
                    "X" : 165.3,
                    "Y": 158.2,
                    "Line": 163.0
                },
                {                    
                    "Z": "I",
                    "X": 160,
                    "Y": 165,
                    "Line": 166.8
                },
                {                    
                    "Z": "J",
                    "X": 173,
                    "Y": 177,
                    "Line": 173.4
                }
    ];
    
    var regressionData = [];
    for (var i = 0; i < 10; i++) {
      regressionData[i] = [oData[i].Current, oData[i].Hist];
    };
​
    var linearRegression = regression('linear', regressionData);
 
    var oModel = new sap.ui.model.json.JSONModel();
    oModel.setData({
      Data : oData
    });
    
    var dataset = new sap.viz.ui5.data.FlattenedDataset({
​
              dimensions : [ {
                axis : 1,
                name : 'Z name',
                value : "{Z}"
              } ],
​
              measures : [ {
                group : 1,
                name : 'X name',
                value : '{X}'
              }, {
                group : 2,
                name : 'Y name',
                value : '{Y}'
              }],
​
              data : {
                path : "/Data",
              }  
    });
    
   var oScatter = new sap.viz.ui5.controls.VizFrame();
   oScatter.setVizType('scatter');
   oScatter.setDataset(dataset); 
    
   oScatter.setVizProperties({
     plotArea: {                
        referenceLine: {
          line : {
            valueAxis : [{
               value : 25,
               visible : true,
               color : "#000000",
               size : 1,
               type : "dotted",
               label : {
                  text : "reference line",
                  visible : true,
                  style : {
                    fontSize : "20px",
                    fontFamily : "sans-serif",
                  }
               }
            }]
          }
        }
     },
     title: {
       visible: false
     },
   });
        
   var feedValueAxis = new sap.viz.ui5.controls.common.feeds.FeedItem({
     'uid': "valueAxis",
     'type': "Measure",
     'values': ["X name"]
   }),
   feedValueAxis2 = new sap.viz.ui5.controls.common.feeds.FeedItem({
     'uid': "valueAxis2",
     'type': "Measure",
     'values': ["Y name"]
   }),
   feedColor = new sap.viz.ui5.controls.common.feeds.FeedItem({
     'uid': "color",
     'type': "Dimension",
     'values': ["Z name"],
   });
​
   oScatter.addFeed(feedValueAxis);
   oScatter.addFeed(feedValueAxis2);
   oScatter.addFeed(feedColor);
   
   oScatter.setModel(oModel);
   oScatter.placeAt("uiArea");
  </script>
</head>
​
<body class="sapUiBody">
  <div id="uiArea"></div> 
</body>
</html>
 
​
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers