Where should JSON-LD be placed on my website? - json-ld

Where do I add the following JSON-LD to my website?
{ "#context": "http://schema.org", "#type": "Organization", "url": "http://www.seekersweb.com/p/anna-university-results-and-student.html", "logo": "http://www.seekersweb.com/2018/08/anna-university-internal-marks.html" }

You just add it to a <script type="application/ld+json"> tag in the bottom of your <body> tag.
With your example, it will look like this;
<script type="application/ld+json">
{ "#context": "http://schema.org", "#type": "Organization", "url": "http://www.seekersweb.com/p/anna-university-results-and-student.html", "logo": "http://www.seekersweb.com/2018/08/anna-university-internal-marks.html" }
</script>

Related

JSON-LD Missing '}' or object member name. Syntax error: value, object or array expected. How to solved this

I tried adding this job posting SD to my HTML I keep getting this
What am I getting wrong
<script type="application/ld+json"> [
{
"#context": "http://schema.org/",
"#type": "JobPosting",
"title": "Job1",
"description": "",
"datePosted": "2018-10-26",
"validThrough": "2018-11-02",
"hiringOrganization": {
"#type": "Place",
"address": {
}
}
},
{
"#context": "http://schema.org/",
"#type": "JobPosting",
"title": "Job2",
"description": "",
"datePosted": "2018-10-26",
"validThrough": "2018-11-02",
"hiringOrganization": {
"#type": "Place",
"address": {
}
}
}
] </script>
I got this two messages from structured data, how do I fix it

AngularJS ng-repeat to display group names from JSON data

How Display stores,bookmarks,favorites using below JSON Data
JSON data (vm.bookmarks):
[
{
"category": "stores",
"title": "store1",
"link": "http://www.store1.com",
},
{
"category": "stores",
"title": "store1",
"link": "http://www.store2.com",
},
{
"category": "bookmarks",
"title": "bookmark1",
"link": "http://www.bookmark1.com",
},
{
"category": "bookmarks",
"title": "bookmark2",
"link": "http://www.bookmark2.com",
},
{
"category": "bookmarks",
"title": "bookmark3",
"link": "http://www.bookmark3.com",
},
{
"category": "favorites",
"title": "favorites1",
"link": "http://www.favorites1.com",
},
{
"category": "favorites",
"title": "favorites2",
"link": "http://www.favorites2.com",
}
]
I want to list only categories' names using ng-repeat:
<div ng-repeat="item in vm.bookmarks|groupBy:'category'">
<h2>{{item.category}}</h2>
</div>
I want this to be displayed:
stores
bookmarks
favorites
But it displays nothing! What am I doing wrong?
P.S
I was using filters without injecting anything, like this:
<div ng-repeat="item in vm.bookmarks|filter:{category:'flyers'}" >
{{item.title}}
</div>
Not sure if I need to inject angular-filter to use groupBy filter - why?
You do not need to use (key, value) , also you need to inject angular.filter as dependency
var MyApp = angular.module("MyApp",['angular.filter']);
<ul class="nav nav-tabs" data-tabs="tabs"
ng-repeat="bookmark in vm.bookmarks|groupBy:'category'">
<li>{{bookmark.category}}</li>
</ul>
DEMO
var app = angular.module("myApp", ['angular.filter']);
app.controller("SimpleController", function($scope) {
this.bookmarks = [
{
"category": "stores",
"title": "store1",
"link": "http://www.store1.com",
},
{
"category": "stores",
"title": "store1",
"link": "http://www.store2.com",
},
{
"category": "bookmarks",
"title": "bookmark1",
"link": "http://www.bookmark1.com",
},
{
"category": "bookmarks",
"title": "bookmark2",
"link": "http://www.bookmark2.com",
},
{
"category": "bookmarks",
"title": "bookmark3",
"link": "http://www.bookmark3.com",
},
{
"category": "favorites",
"title": "favorites1",
"link": "http://www.favorites1.com",
},
{
"category": "favorites",
"title": "favorites2",
"link": "http://www.favorites2.com",
}
];
var vm = this;
});
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.16/angular-filter.js" > </script>
<body ng-app="myApp">
<div>
<div data-ng-controller="SimpleController as vm">
<ul class="nav nav-tabs" data-tabs="tabs"
ng-repeat="(key, value) in (vm.bookmarks|groupBy:'category')">
<div ng-repeat="cat in value | unique:'category' ">
<h1> {{cat.category}}</h1>
</div>
</ul>
</div>
</div>
</body>
</html>

show data from nested JSON array

how to show "city" from this JSON file through angularJS http:
{"ers":{"resMessage":"1","response":"Success","data":{"alarms":[{"id":"1","alarm_id":"2","title":"Fire","description":"fire","type":"Fire","priority":"High","address":"Kanpur, Uttar Pradesh, India","city":"Kanpur","state":"UP","country":"India","zipcode":"123456","lattitude":"26.449923","longitude":"80.3318736"},{"id":"3","alarm_id":"4","title":"test-02","description":"test-02","type":"Medical","priority":"High","address":"Borivali West, Mumbai, Maharashtra, India","city":"Mumbai","state":"MH","country":"India","zipcode":"123456","lattitude":"19.2461644","longitude":"72.85090560000003"}]}}}
Step 1:
Call url and get json data in $scope.data variable and use ng repeat in your template
Step 2:
Use angular for each for get city in controller
Refer following example
angular.module('myApp',[]).controller('myCtrl', function($scope){
$scope.data = {
"ers": {
"resMessage": "1",
"response": "Success",
"data": {
"alarms": [{
"id": "1",
"alarm_id": "2",
"title": "Fire",
"description": "fire",
"type": "Fire",
"priority": "High",
"address": "Kanpur, Uttar Pradesh, India",
"city": "Kanpur",
"state": "UP",
"country": "India",
"zipcode": "123456",
"lattitude": "26.449923",
"longitude": "80.3318736"
}, {
"id": "3",
"alarm_id": "4",
"title": "test-02",
"description": "test-02",
"type": "Medical",
"priority": "High",
"address": "Borivali West, Mumbai, Maharashtra, India",
"city": "Mumbai",
"state": "MH",
"country": "India",
"zipcode": "123456",
"lattitude": "19.2461644",
"longitude": "72.85090560000003"
}]
}
}
};
angular.forEach($scope.data.ers.data.alarms, function(value) {
console.log(value.city)
});
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
<div ng-repeat="obj in data.ers.data.alarms">
City:- {{obj.city}}<br>
Address:- {{obj.address}}
</div>
</div>
Hope this will help you
You can use ng-repeat over myData.ers.data.alarms
DEMO
angular.module('myApp',[]).controller('myCtrl', function($scope){
$scope.myData = {"ers":{"resMessage":"1","response":"Success","data":{"alarms":[{"id":"1","alarm_id":"2","title":"Fire","description":"fire","type":"Fire","priority":"High","address":"Kanpur, Uttar Pradesh, India","city":"Kanpur","state":"UP","country":"India","zipcode":"123456","lattitude":"26.449923","longitude":"80.3318736"},{"id":"3","alarm_id":"4","title":"test-02","description":"test-02","type":"Medical","priority":"High","address":"Borivali West, Mumbai, Maharashtra, India","city":"Mumbai","state":"MH","country":"India","zipcode":"123456","lattitude":"19.2461644","longitude":"72.85090560000003"}]}}};
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
<div ng-repeat="data in myData.ers.data.alarms">
<h1> {{data.city}}</h1>
</div>
</div>

Fatching JSON data into angularjs

I am trying to read data from json file into angular.js but i am not getting data.
[
{
"code": "AD",
"name": "Andorra",
"population": "84000"
},
{
"code": "TN",
"name": "Tunisia",
"population": "10589025"
},
{
"code": "TW",
"name": "Taiwan",
"population": "22894384"
},
{
"code": "TZ",
"name": "Tanzania",
"population": "41892895"
},
{
"code": "UA",
"name": "Ukraine",
"population": "45415596"
},
{
"code": "UG",
"name": "Uganda",
"population": "33398682"
},
{
"code": "UM",
"name": "U.S. Minor Outlying Islands",
"population": "0"
},
{
"code": "US",
"name": "United States",
"population": "310232863"
},
{
"code": "UY",
"name": "Uruguay",
"population": "3477000"
},
{
"code": "UZ",
"name": "Uzbekistan",
"population": "27865738"
},
{
"code": "VA",
"name": "Vatican City",
"population": "921"
},
{
"code": "VC",
"name": "Saint Vincent and the Grenadines",
"population": "104217"
},
{
"code": "VE",
"name": "Venezuela",
"population": "27223228"
},
{
"code": "VG",
"name": "British Virgin Islands",
"population": "21730"
},
{
"code": "VI",
"name": "U.S. Virgin Islands",
"population": "108708"
},
{
"code": "VN",
"name": "Vietnam",
"population": "89571130"
},
{
"code": "VU",
"name": "Vanuatu",
"population": "221552"
},
{
"code": "WF",
"name": "Wallis and Futuna",
"population": "16025"
},
{
"code": "WS",
"name": "Samoa",
"population": "192001"
},
{
"code": "ZW",
"name": "Zimbabwe",
"population": "11651858"
}
]
index.html
<html ng-app="countryApp">
<head>
<meta charset="utf-8">
<title>Angular.js JSON Fetching Example</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
<script>
var countryApp = angular.module('countryApp', []);
countryApp.controller('CountryCtrl', function ($scope, $http){
$http.get('countries.json').success(function(data) {
$scope.countries = data;
});
});
</script>
</head>
<body ng-controller="CountryCtrl">
<h2>Angular.js JSON Fetching Example</h2>
<table>
<tr>
<th>Code</th>
<th>Country</th>
<th>Population</th>
</tr>
<tr ng-repeat="country in countries">
<td>{{country.code}}</td>
<td>{{country.name}}</td>
<td>{{country.population}}</td>
</tr>
</table>
</body>
</html>
when you make an $http.get call, the callback function returns the response object. This means that you need to access the data property of the response, not just assign the response:
$http.get('countries.json').success(function(response) {
$scope.countries = response.data;
});
take a look at the docs for $http.get, specifically the example ($http docs)
Please check the path of the json file because the code it's fine.
If you are executing the code from your local machine you need a server to run the code like nodejs.

How to create network graph or hierarchical tree using visjs in angularjs?

I need some help in creating a network graph using visjs in angularjs. I am working on this plunker to achieve something like this
I followed the steps mentioned in AngularJS - visjs but was unable to make it work so I created a plunker (given above) to get help from community.
Controller code.
var app = angular.module('app', ['ngVis']);
app.controller('MainCtrl', ['$scope', 'VisDataSet',
function($scope, VisDataSet) {
$scope.data = VisDataSet({
"1": {
"id": 1,
"content": "<i class=\"fi-flag\"></i> item 1",
"start": "2014-09-01T17:59:13.706Z",
"className": "magenta",
"type": "box"
},
"2": {
"id": 2,
"content": "visjs.org",
"start": "2014-09-02T17:59:13.706Z",
"type": "box"
},
"3": {
"id": 3,
"content": "item 3",
"start": "2014-08-29T17:59:13.706Z",
"type": "box"
},
"4": {
"id": 4,
"content": "item 4",
"start": "2014-09-01T17:59:13.706Z",
"end": "2014-09-03T17:59:13.706Z",
"type": "range"
},
"5": {
"id": 5,
"content": "item 5",
"start": "2014-08-30T17:59:13.706Z",
"type": "point"
},
"6": {
"id": 6,
"content": "item 6",
"start": "2014-09-04T17:59:13.706Z",
"type": "point"
},
"7": {
"id": 7,
"content": "<i class=\"fi-anchor\"></i> item 7",
"start": "2014-08-28T17:59:13.706Z",
"end": "2014-08-29T17:59:13.706Z",
"type": "range",
"className": "orange"
}
});
$scope.options = {
"align": "center",
"autoResize": true,
"editable": true,
"selectable": true,
"orientation": "bottom",
"showCurrentTime": true,
"showCustomTime": true,
"showMajorLabels": true,
"showMinorLabels": true
};
}
]);
Please help me in figuring out the problem in this plunker
I saw a few issues. First, you were including your css files as scripts instead of as stylesheets. So use this:
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.3.0/vis.css">
<link rel="stylesheet" type="text/css" href="style.css">
Second if you take a look at angular-vis.js, you'll see that the directive should actually be vis-timeline. So I just changed it to this in the html:
<vis-timeline data="data" options="options"></vis-timeline>
I removed the events attribute because that wasn't defined on your scope, but I assume you can look at the visjs documentation to see what should go there.
See the revised plunker for the whole fix.

Resources