如何遮蔽JSXGraph板的各个部分?

时间:2017-12-14 20:43:07

标签: javascript jsxgraph

我设置了一个jsxgraph板,其中包含一些简单的线条,如下所示:

my jsxgraph

我想遮挡它的一部分,例如,蓝线和虚线之间的白色区域。最好的方法是什么?我查看了the API,但没有一个提供的元素突然出现在我面前,到目前为止我还没有看到任何我想做的事情。 Inequality元素是否可以轻松扩展到多行?

1 个答案:

答案 0 :(得分:1)

You can use a polygon and hide the edges and vertices of the polygon. Here is an example:

function GetRelatedBillingDocumentsFromList(selectProperties, currentBillCyclePath, clientCode, jobCodes, engagementCode, enhanceFunctions) {
                $log.info("Retrieving related billing documents for bill cycle with name [" + currentBillCyclePath + "]");                  
                var deferred = $q.defer();
                var webUrl = _spPageContextInfo.webAbsoluteUrl;
                var viewFields = spService.ConvertSelectPropertiesToViewFields(selectProperties);
                // query must return the documents for the same client but in other bill cycles not the current one
                var camlQuery = '<View Scope="RecursiveAll">' +   viewFields + 
                        '<Query>' +
                            '<Where>' +
                                '<And>' +
                                    '<Eq>' +
                                        '<FieldRef Name="ClientCode" />' +
                                        '<Value Type="Text">'+ clientCode + '</Value>' +
                                    '</Eq>' +
                                    '<Neq>' +
                                        '<FieldRef Name="ContentType" />' +
                                        '<Value Type="Computed">Bill Cycle</Value>' +
                                    '</Neq>' +
                                '</And>' +
                            '</Where>' +
                        '</Query>' +
                    '</View>';

                var billCyclesListId = "{c23bbae4-34f7-494c-8f67-acece3ba60da}";                    
                spService.GetListItems(billCyclesListId, camlQuery, selectProperties)
                .then(function(listItems) {                 
                    var listItemsWithValues = [];

                    if(listItems) {
                        var enumerator = listItems.getEnumerator();
                        var promises = [];
                        while (enumerator.moveNext()) {
                            var listItem = enumerator.get_current();
                            var listItemValues = [];                                
                            selectProperties
                            .forEach(function(propertyName) {                               
                                var value = listItem.get_item(propertyName);
                                if(propertyName === "PwC_JobCodesMulti"){
                                    jobvalue = "";
                                    value.forEach(function(jobvalues){
                                        jobvalue+= jobvalues.get_lookupValue() +";";
                                    })
                                    listItemValues[propertyName] = jobvalue;
                                }else{
                                    listItemValues[propertyName] = value;
                                }   
                            });

                            listItemsWithValues.push(listItemValues);
                        }

                        var promises = listItemsWithValues.map(addContentType);
                        Promise.all(promises).then(youCanUseTheData);

                        function youCanUseTheData(){
                            /*
                            At this point, each listItem holds the 'Document Type' info
                            */
                            listItemsWithValues.forEach(function(listItem) {
                                var fileDirRef = listItem["FileRef"];
                                var id = listItem["ID"];
                                var title = listItem["Title"];
                                var serverUrl = _spPageContextInfo.webAbsoluteUrl.replace(_spPageContextInfo.webServerRelativeUrl,"");                          
                                var dispFormUrl = serverUrl + "/sites/billing/_layouts/15/DocSetHome.aspx?id="+fileDirRef;
                                //listItem["FileRef"] = dispFormUrl;
                                //listItem["Bill Cycle"] = dispFormUrl;

                                var parentLink = listItem["FileRef"];
                                arrayofstrings = parentLink.split("/");
                                var billCycleFolderName = arrayofstrings[arrayofstrings.length-2];
                                arrayofstrings.pop();
                                var hyperLink = '<a href="' + arrayofstrings.join('/') + '">' + billCycleFolderName + '</a>';                           
                                listItem["Bill Cycle"] = hyperLink; 

                            });
                        }
                    }                   


                    var enhancedListItemValues = spService.SpSearchQuery.EnhanceSearchResults(listItemsWithValues, enhanceFunctions);                       
                    deferred.resolve(listItemsWithValues);
                })
                .catch (function (message) {
                    deferred.reject();
                });

                return deferred.promise;
            }

            function addContentType(listItem){
                return getContentTypeOfCurrentItem(listItem.ID.toString()).then(function(cname){
                    listItem['Document Type'] = cname; //we add the doc type to each listItem, not only the last one
                });
            }

            function getContentTypeOfCurrentItem(id) {
                return new Promise(function (resolve, reject) {
                    var clientContext = new SP.ClientContext.get_current();
                    var oList = clientContext.get_web().get_lists().getByTitle("Bill Cycles");
                    listItem = oList.getItemById(id);
                    clientContext.load(listItem);
                    listContentTypes = oList.get_contentTypes();
                    clientContext.load(listContentTypes);
                    clientContext.executeQueryAsync(
                        function() {
                            $log.info("Successfully retrieved getContentTypeOfCurrentItemt");
                            var ctid = listItem.get_item("ContentTypeId").toString();            
                            var ct_enumerator = listContentTypes.getEnumerator();
                            while (ct_enumerator.moveNext()) {
                                var ct = ct_enumerator.get_current();            
                                if (ct.get_id().toString() == ctid) {
                                    var contentTypeName = ct.get_name();
                                }
                            }
                            resolve(contentTypeName);
                       },
                       function(error, errorInfo) {
                            $log.warn("Retrieving getContentTypeOfCurrentItem failed");
                            reject(errorInfo);
                       }
                    );
                });
            }

If you need to intersect the coordinate axes, you can access them with var board = JXG.JSXGraph.initBoard("jxgbox", { boundingbox: [-1, 5, 5, -1], axis: true }); var p1 = board.create('point', [2, 1]); var shade = board.create('polygon', [p1, [0,p1.Y()], [0,4]], { borders: {visible: false}, vertices: {visible: false} } ); and board.defaultAxes.x.