열 방향 자동 병합

SpreadJS는 셀에 동일한 텍스트가 포함되며 셀이 걸친 범위에 포함되지 않는 경우 인접한 열 셀을 자동으로 병합할 수 있는 열 자동 병합을 지원합니다.

autoMerge 메서드를 사용하여 자동 병합을 설정할 수 있습니다. 자동 병합 설정을 위한 두 가지 옵션은 다음과 같습니다. 자유 모드 - 이 모드에서는 동일한 값을 가진 셀이 인접한 셀과 자동으로 병합됩니다. 제한 모드 - 이 모드에서는 이전 행 또는 열의 해당 셀이 비슷한 방식으로 병합된 경우에만 동일한 값을 가진 셀이 인접한 셀과 병합됩니다. 다음 코드는 제한 모드에서 자동 병합을 적용합니다. 다음 코드는 자유 모드에서 자동 병합을 적용합니다. 선택 모드에서 자동 병합은 다음 두 가지 옵션으로 설정할 수 있습니다. 소스 선택 모드 - 이 선택 모드에서는 자동으로 병합된 영역의 개별 셀을 선택할 수 있습니다. 병합된 선택 모드 - 이 선택 모드에서는 자동으로 병합된 영역의 모든 셀을 선택할 수 있습니다. 다음 코드는 소스 선택 모드에서 자동 병합을 적용합니다. 다음 코드는 병합된 선택 모드에서 자동 병합을 적용합니다. includeAutoMergedCells 옵션이 통합 문서 json 직렬화에 추가되어 Excel에서 병합된 일반 셀에 자동으로 병합된 셀을 저장할 수 있습니다. 이 옵션의 기본값은 false입니다.
import { Component, NgModule, enableProdMode } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; import GC from '@mescius/spread-sheets'; import { SpreadSheetsModule } from '@mescius/spread-sheets-angular'; import '@mescius/spread-sheets-resources-ko'; GC.Spread.Common.CultureManager.culture("ko-kr"); import { getData } from './app.data'; import './styles.css'; @Component({ selector: 'app-component', templateUrl: 'src/app.component.html' }) export class AppComponent { autoGenerateColumns = false; autoMergeMode = GC.Spread.Sheets.AutoMerge.AutoMergeMode.restricted; autoMergeSelectionMode = GC.Spread.Sheets.AutoMerge.SelectionMode.merged; dataSource: any[]; spread: GC.Spread.Sheets.Workbook; hostStyle = { width: 'calc(100% - 280px)', height: '100%', overflow: 'hidden', float: 'left' }; constructor() { this.dataSource = getData(); } initSpread($event: any) { this.spread = $event.spread; let spread = this.spread; spread.suspendPaint(); let sheet = spread.getActiveSheet(); //bind data source sheet.setRowHeight(0, 30, 1); sheet.setColumnWidth(4, '*'); //apply auto merge let range = new GC.Spread.Sheets.Range(-1, -1, -1, -1); sheet.autoMerge(range, GC.Spread.Sheets.AutoMerge.AutoMergeDirection.column, this.autoMergeMode, GC.Spread.Sheets.SheetArea.viewport, this.autoMergeSelectionMode); spread.resumePaint(); } switchAutoMergeMode(event: any) { this.autoMergeMode = parseInt(event.target.value); this._refreshAutoMerge(); } switchAutoMergeSelectionMode(event: any) { this.autoMergeSelectionMode = parseInt(event.target.value); this._refreshAutoMerge(); //update selection when selection mode is changed after auto merge range is applied let sheet = this.spread.getActiveSheet(); sheet.setActiveCell(sheet.getActiveRowIndex(), sheet.getActiveColumnIndex()); } _refreshAutoMerge() { let spread = this.spread; let range = new GC.Spread.Sheets.Range(-1, -1, -1, -1); let sheet = spread.getActiveSheet(); sheet.suspendPaint(); //remove old auto merge range sheet.autoMerge(range, GC.Spread.Sheets.AutoMerge.AutoMergeDirection.none); //add new auto merge range sheet.autoMerge(range, GC.Spread.Sheets.AutoMerge.AutoMergeDirection.column, this.autoMergeMode, GC.Spread.Sheets.SheetArea.viewport, this.autoMergeSelectionMode); sheet.resumePaint(); } } @NgModule({ imports: [BrowserModule, SpreadSheetsModule], declarations: [AppComponent], exports: [AppComponent], bootstrap: [AppComponent] }) export class AppModule {} enableProdMode(); // Bootstrap application with hash style navigation and global services. platformBrowserDynamic().bootstrapModule(AppModule);
<!doctype html> <html style="height:100%;font-size:14px;"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link rel="stylesheet" type="text/css" href="$DEMOROOT$/ko/angular/node_modules/@mescius/spread-sheets/styles/gc.spread.sheets.excel2013white.css"> <!-- Polyfills --> <script src="$DEMOROOT$/ko/angular/node_modules/core-js/client/shim.min.js"></script> <script src="$DEMOROOT$/ko/angular/node_modules/zone.js/fesm2015/zone.min.js"></script> <!-- SystemJS --> <script src="$DEMOROOT$/ko/angular/node_modules/systemjs/dist/system.js"></script> <script src="systemjs.config.js"></script> <script> // workaround to load 'rxjs/operators' from the rxjs bundle System.import('rxjs').then(function (m) { System.import('@angular/compiler'); System.set(SystemJS.resolveSync('rxjs/operators'), System.newModule(m.operators)); System.import('$DEMOROOT$/ko/lib/angular/license.ts'); System.import('./src/app.component'); }); </script> </head> <body> <app-component></app-component> </body> </html>
<div class="sample-tutorial"> <gc-spread-sheets [hostStyle]="hostStyle" (workbookInitialized)="initSpread($event)"> <gc-worksheet [dataSource]="dataSource" [autoGenerateColumns]='autoGenerateColumns'> <gc-column dataField="Country" width=180></gc-column> <gc-column dataField="State" width=120></gc-column> <gc-column dataField="City" width=120></gc-column> <gc-column dataField="Product" width=280></gc-column> <gc-column dataField="Detail"></gc-column> </gc-worksheet> </gc-spread-sheets> <div class="options-container"> <div class="option-row"> Changes the auto merge mode. <select id="switchAutoMergeMode" (change)="switchAutoMergeMode($event)"> <option value="0">Free</option> <option value="1" selected>Restricted</option> </select> </div> <div class="option-row"> Changes the auto merge selection mode. <select id="switchAutoMergeSelectionMode" (change)="switchAutoMergeSelectionMode($event)"> <option value="0">Source</option> <option value="1" selected>Merged</option> </select> </div> </div> </div>
export function getData() { return [{ "Country": "United Kingdom", "State": "England", "City": "Basildon", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "United Kingdom", "State": "England", "City": "London", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "United Kingdom", "State": "England", "City": "Manchester", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "United Kingdom", "State": "England", "City": "London", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "United Kingdom", "State": "England", "City": "Newbury", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "United Kingdom", "State": "England", "City": "Kemble", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "United Kingdom", "State": "England", "City": "Headley", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "United Kingdom", "State": "England", "City": "Southampton", "Product": "Planters Deluxe Whole Cashew", "Detail": "18.25 Ounce" }, { "Country": "United Kingdom", "State": "England", "City": "Cheltenham", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "United Kingdom", "State": "England", "City": "Bournemouth", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "United Kingdom", "State": "Northern Ireland", "City": "Helens Bay", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "United States", "State": "MO", "City": "Parkville", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "United States", "State": "OR", "City": "Astoria", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "United States", "State": "AL", "City": "Cahaba Heights", "Product": "Kraft Real Mayo", "Detail": "30 Ounces" }, { "Country": "United States", "State": "NJ", "City": "Mickleton", "Product": "Kraft Real Mayo", "Detail": "30 Ounces" }, { "Country": "United States", "State": "NJ", "City": "Riverside", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "United States", "State": "NJ", "City": "Clinton", "Product": "Teddy Grahams Crackers", "Detail": "Honey 10-Ounce Boxes 6-Pack" }, { "Country": "United States", "State": "IL", "City": "Peoria", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "United States", "State": "IL", "City": "Morton", "Product": "Teddy Grahams Crackers", "Detail": "Honey 10-Ounce Boxes 6-Pack" }, { "Country": "United States", "State": "IL", "City": "Flossmoor", "Product": "Teddy Grahams Crackers", "Detail": "Honey 10-Ounce Boxes 6-Pack" }, { "Country": "United States", "State": "IL", "City": "Genoa", "Product": "Kraft Real Mayo", "Detail": "30 Ounces" }, { "Country": "United States", "State": "TN", "City": "Martin", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "United States", "State": "TN", "City": "Memphis", "Product": "Teddy Grahams Crackers", "Detail": "Honey 10-Ounce Boxes 6-Pack" }, { "Country": "United States", "State": "NY", "City": "New York", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "United States", "State": "NY", "City": "New York", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "United States", "State": "NY", "City": "New York", "Product": "Teddy Grahams Crackers", "Detail": "Honey 10-Ounce Boxes 6-Pack" }, { "Country": "United States", "State": "NY", "City": "Brooklyn", "Product": "Teddy Grahams Crackers", "Detail": "Honey 10-Ounce Boxes 6-Pack" }, { "Country": "United States", "State": "NY", "City": "New Rochelle", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "United States", "State": "NY", "City": "Staten Island", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "United States", "State": "TX", "City": "Shavano Park", "Product": "Kraft Real Mayo", "Detail": "30 Ounces" }, { "Country": "United States", "State": "TX", "City": "Sugar Land", "Product": "Kraft Real Mayo", "Detail": "30 Ounces" }, { "Country": "United States", "State": "TX", "City": "Houston", "Product": "Planters Deluxe Whole Cashew", "Detail": "18.25 Ounce" }, { "Country": "United States", "State": "TX", "City": "Houston", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "United States", "State": "TX", "City": "Lakewood Village", "Product": "Planters Deluxe Whole Cashew", "Detail": "18.25 Ounce" }, { "Country": "United States", "State": "ID", "City": "Eagle", "Product": "Planters Deluxe Whole Cashew", "Detail": "18.25 Ounce" }, { "Country": "United States", "State": "UT", "City": "Salt Lake City", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "United States", "State": "CA", "City": "Chula Vista", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "United States", "State": "CA", "City": "Los Gatos", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "United States", "State": "CA", "City": "Santa Monica", "Product": "Planters Deluxe Whole Cashew", "Detail": "18.25 Ounce" }, { "Country": "United States", "State": "CA", "City": "Irvine", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "United States", "State": "CA", "City": "San Francisco", "Product": "Teddy Grahams Crackers", "Detail": "Honey 10-Ounce Boxes 6-Pack" }, { "Country": "United States", "State": "FL", "City": "Miami", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "United States", "State": "FL", "City": "Delray Beach", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "United States", "State": "FL", "City": "Fort Lauderdale", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "United States", "State": "FL", "City": "Amelia Island", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "United States", "State": "FL", "City": "Coral Gables", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "United States", "State": "FL", "City": "Miami", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "United States", "State": "FL", "City": "Parkland", "Product": "Planters Deluxe Whole Cashew", "Detail": "18.25 Ounce" }, { "Country": "United States", "State": "VA", "City": "Reston", "Product": "Kraft Real Mayo", "Detail": "30 Ounces" }, { "Country": "United States", "State": "VA", "City": "Keller", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "United States", "State": "VA", "City": "Keller", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "United States", "State": "AZ", "City": "Phoenix", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "United States", "State": "VT", "City": "Pittsfield", "Product": "Planters Deluxe Whole Cashew", "Detail": "18.25 Ounce" }, { "Country": "United States", "State": "VT", "City": "Pittsfield", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "United States", "State": "GA", "City": "Ball Ground", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "United States", "State": "GA", "City": "Sandy Springs", "Product": "Planters Deluxe Whole Cashew", "Detail": "18.25 Ounce" }, { "Country": "United States", "State": "IA", "City": "Ankeny", "Product": "Kraft Real Mayo", "Detail": "30 Ounces" }, { "Country": "United States", "State": "NC", "City": "Pittsboro", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "United States", "State": "OH", "City": "Beachwood", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "United States", "State": "OH", "City": "Cincinnati", "Product": "Kraft Real Mayo", "Detail": "30 Ounces" }, { "Country": "United States", "State": "NH", "City": "W Lebanon", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "United States", "State": "MD", "City": "Woodsboro", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "United States", "State": "Michigan", "City": "Farmington", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "United States", "State": "HI", "City": "Honolulu", "Product": "Kraft Real Mayo", "Detail": "30 Ounces" }, { "Country": "United States", "State": "CO", "City": "Englewood", "Product": "Planters Deluxe Whole Cashew", "Detail": "18.25 Ounce" }, { "Country": "United States", "State": "KY", "City": "Owensboro", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "Australia", "State": "Victoria", "City": "Echuca", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "Australia", "State": "Victoria", "City": "Melbourne", "Product": "Teddy Grahams Crackers", "Detail": "Honey 10-Ounce Boxes 6-Pack" }, { "Country": "Australia", "State": "Queensland", "City": "Burpengary", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "Australia", "State": "Queensland", "City": "Gold Coast", "Product": "Planters Deluxe Whole Cashew", "Detail": "18.25 Ounce" }, { "Country": "Israel", "State": "Tel Aviv", "City": "Tel Aviv", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "France", "State": "Ile-de-France", "City": "Chatou", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "France", "State": "Upper Normandy", "City": "Rouen", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "Netherlands", "State": "Noord-Brabant", "City": "Eindhoven", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "Netherlands", "State": "Noord-Holland", "City": "Badhoevedorp", "Product": "Kraft Real Mayo", "Detail": "30 Ounces" }, { "Country": "Ireland", "State": "Meath", "City": "Julianstown", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "Ireland", "State": "Cork", "City": "Ballynora", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "Ireland", "State": "Dublin", "City": "Kinsaley", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "Ireland", "State": "Dublin", "City": "Rathgar", "Product": "Kraft Real Mayo", "Detail": "30 Ounces" }, { "Country": "Canada", "State": "Ontario", "City": "Ottawa", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "Canada", "State": "Ontario", "City": "Belleville", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "Canada", "State": "Ontario", "City": "Alliston", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "Canada", "State": "British Columbia", "City": "Maple Ridge District Municipality", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "Canada", "State": "British Columbia", "City": "Comox", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "Canada", "State": "British Columbia", "City": "Vancouver", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "Canada", "State": "British Columbia", "City": "Vancouver", "Product": "Planters Deluxe Whole Cashew", "Detail": "18.25 Ounce" }, { "Country": "Canada", "State": "British Columbia", "City": "Tsawwassen", "Product": "Teddy Grahams Crackers", "Detail": "Honey 10-Ounce Boxes 6-Pack" }, { "Country": "Canada", "State": "Saskatchewan", "City": "Prince Albert", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "Canada", "State": "Alberta", "City": "Red Deer", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "Canada", "State": "Alberta", "City": "Calgary", "Product": "Planters Deluxe Whole Cashew", "Detail": "18.25 Ounce" }, { "Country": "Canada", "State": "Alberta", "City": "Calgary", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "Canada", "State": "Alberta", "City": "Okotoks", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "India", "State": "Andhra Pradesh", "City": "Hyderabad", "Product": "Teddy Grahams Crackers", "Detail": "Honey 10-Ounce Boxes 6-Pack" }, { "Country": "South Africa", "State": "Gauteng", "City": "Roodepoort", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "Finland", "State": "Ita-Suomen Laani", "City": "Kuopio", "Product": "Planters Deluxe Whole Cashew", "Detail": "18.25 Ounce" }, { "Country": "Switzerland", "State": "Geneve", "City": "Vesenaz", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "Switzerland", "State": "Vaud", "City": "Lausanne", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "Switzerland", "State": "Vaud", "City": "Morges", "Product": "Kraft Real Mayo", "Detail": "30 Ounces" }, { "Country": "Denmark", "State": "Frederiksborg", "City": "Helsingor", "Product": "Planters Deluxe Whole Cashew", "Detail": "18.25 Ounce" }, { "Country": "Denmark", "State": "Kobenhavn", "City": "Kobenhavn", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "Denmark", "State": "Storstrom", "City": "Nakskov", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "Belgium", "State": "Brussels (Bruxelles)", "City": "Brussels", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "Sweden", "State": "Stockholm", "City": "Saltsjobaden", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "Norway", "State": "Rogaland", "City": "Stavanger", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "Norway", "State": "Oslo", "City": "Oslo", "Product": "Planters Deluxe Whole Cashew", "Detail": "18.25 Ounce" }, { "Country": "Luxembourg", "State": "Luxembourg", "City": "Gasperich", "Product": "Planters Deluxe Whole Cashew", "Detail": "18.25 Ounce" }, { "Country": "Italy", "State": "Lombardy", "City": "Milan", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "Germany", "State": "Nordrhein-Westfalen", "City": "Telgte", "Product": "Jaybee's Gourmet Nuts Gift Pack (3 Lb)", "Detail": "Premium Quality Nuts Elegant Design Vegetarian Friendly & Kosher" }, { "Country": "Moldova", "State": "Chisinau", "City": "Bubuieci", "Product": "Smartfood Popcorn", "Detail": "White Cheddar 9 Ounce" }, { "Country": "Spain", "State": "Murcia", "City": "La Alberca", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }, { "Country": "United Arab Emirates", "State": "Dubayy", "City": "Jumeira", "Product": "KIND Bars Almond & Coconut Gluten Free", "Detail": "1.4 Ounce Bars 12 Count" }, { "Country": "Bahrain", "State": "Al Manamah", "City": "Al 'Adliyah", "Product": "Kraft Grated Parmesan Cheese", "Detail": "24 oz" }]; }
.sample-tutorial { position: relative; height: 100%; overflow: hidden; } .options-container { float: right; width: 280px; padding: 12px; height: 100%; box-sizing: border-box; background: #fbfbfb; overflow: auto; } .option-row { font-size: 14px; padding: 5px; margin-top: 10px; } #switchAutoMergeMode { margin: 10px 0px; } body { position: absolute; top: 0; bottom: 0; left: 0; right: 0; }
(function (global) { System.config({ transpiler: 'ts', typescriptOptions: { tsconfig: true }, meta: { 'typescript': { "exports": "ts" }, '*.css': { loader: 'css' } }, paths: { // paths serve as alias 'npm:': 'node_modules/' }, // map tells the System loader where to look for things map: { 'core-js': 'npm:core-js/client/shim.min.js', 'zone': 'npm:zone.js/fesm2015/zone.min.js', 'rxjs': 'npm:rxjs/dist/bundles/rxjs.umd.min.js', '@angular/core': 'npm:@angular/core/fesm2022', '@angular/common': 'npm:@angular/common/fesm2022/common.mjs', '@angular/compiler': 'npm:@angular/compiler/fesm2022/compiler.mjs', '@angular/platform-browser': 'npm:@angular/platform-browser/fesm2022/platform-browser.mjs', '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/fesm2022/platform-browser-dynamic.mjs', '@angular/common/http': 'npm:@angular/common/fesm2022/http.mjs', '@angular/router': 'npm:@angular/router/fesm2022/router.mjs', '@angular/forms': 'npm:@angular/forms/fesm2022/forms.mjs', 'jszip': 'npm:jszip/dist/jszip.min.js', 'typescript': 'npm:typescript/lib/typescript.js', 'ts': './plugin.js', 'tslib':'npm:tslib/tslib.js', 'css': 'npm:systemjs-plugin-css/css.js', 'plugin-babel': 'npm:systemjs-plugin-babel/plugin-babel.js', 'systemjs-babel-build':'npm:systemjs-plugin-babel/systemjs-babel-browser.js', '@mescius/spread-sheets': 'npm:@mescius/spread-sheets/index.js', '@mescius/spread-sheets-resources-ko': 'npm:@mescius/spread-sheets-resources-ko/index.js', '@mescius/spread-sheets-angular': 'npm:@mescius/spread-sheets-angular/fesm2020/mescius-spread-sheets-angular.mjs', '@grapecity/jsob-test-dependency-package/react-components': 'npm:@grapecity/jsob-test-dependency-package/react-components/index.js' }, // packages tells the System loader how to load when no filename and/or no extension packages: { src: { defaultExtension: 'ts' }, rxjs: { defaultExtension: 'js' }, "node_modules": { defaultExtension: 'js' }, "node_modules/@angular": { defaultExtension: 'mjs' }, "@mescius/spread-sheets-angular": { defaultExtension: 'mjs' }, '@angular/core': { defaultExtension: 'mjs', main: 'core.mjs' } } }); })(this);